CODEWITHSUNDEEP
angularangular7angular-reactive-forms
Nanda
Nanda

Reputation: 45

Angular 7 Reactive Form Array - Calculate Form values

I have been creating a billing application where I will be capturing item name and price. I want to give discount for the item so I will be having discount in percentage and discount in dollar text boxes. In some cases, either I can enter discount in percentage or discount in dollar values so I want to display both of the them at run time. For example, if I enter discount in dollar then I have to display value in discount in percentage. Can you please help me to solve the requirement?

I have created a sample application using Stackblitz with Angular and reactive forms - https://stackblitz.com/edit/github-hayn68-yjqorz

Upvotes: 0

Views: 1400

Answers (1)

Ala Abid
Ala Abid

Reputation: 2326

Try this:

<td class="form-group">
      <input #perc type="text" class="form-control" formControlName="discountInPercentage" 
      (change)="percChanged(i, perc.value)">
</td>

TS

percChanged(i, val){
    this.itemForm.value.items[i].discountInDollar = this.itemForm.value.items[i].rate/100*val;
    this.itemForm.controls['items'].setValue(this.itemForm.value.items);
    console.log(this.itemForm.value.items[i].discountInDollar);
}

Change the %Discount value and you should see the output. Stackblitz example

Upvotes: 1

Related Questions