`Hi, I’m new to this angular stuff and do not quite understand how to do this part of the form.
We have had people click the submit button multiple times very quickly and add the same information just as many times before it can even send the information to the API.

I’ve tried searching on here and even googled it but I feel like our forms are very specific and could not find anything that seemed even close.

Below is the submit button code out of the claim.components.ts file.

Here is what I have and any suggestions would be really helpful:’

onSubmit(model: ClaimDto) {
if (!this.form.disabled) {
if (this.form.valid) {
if (this.form.dirty) {
if (this.mode === this.modes.Add) {
delete model["CompanyName"];
delete model["EffectiveDate"];
delete model["ExpirationDate"];
delete model["CancelDate"];
model.UserCreated = localStorage.getItem("name");
this.userService.AddClaim(model).subscribe(
data => {
if (data) {
if (data.Status == "Success") {
if (data.Claim.Cclmntid.trim() == "") {
this.onRowSelect({ data: data.Claim }); }
else {
this.searchCriteria.setValue(
{ policyNumber: data.Claim.PolicyNumber,
claimNumber: data.Claim.ClaimNumber,
dateOfLoss: data.Claim.DateOfLoss });
this.onSearch(); } }
else {
this.confirmationService.confirm(
{ key: "error-message",
message: "The claim was NOT created. You may try again after clicking OK. If the problem 
accept: () => { } }); } } },
err => {
this.confirmationService.confirm(
{ key: "error-message",
message: "The claim was NOT created. You may try again after clicking OK. If the problem   
persists, contact the Helpdesk.",
accept: () => { } }); },
() => { }); } }
else {
this.confirmationService.confirm(
{ key: "notice",
message: "You haven't made any changes to the claim.",
accept: () => { } }); } }
else {
this.confirmationService.confirm(
{ key: "error-message",
message: "There are errors on the form. Click OK to make corrections before resubmitting.",
accept: () => { } }); } } 
}