I am looking to perform a calculation similar to this: total = quantity * price and continuously update the total when either the quantity or the price changes.
app.component.html
<form [formGroup]="editform" (ngSubmit)="edisale()" class="col s12" materialize>
<div class="form-group">
<table align="center" class="table table-bordered table-hover">
<thead>
<tr style="color:black;">
<th>Price</th>
<th>Quantity</th>
<th>Notes</th>
<th>Subtotal</th>
</tr>
</thead>
<tbody>
<tr formArrayName="products" class="group" style="cursor: pointer" *ngFor="let sale of editform.get('products').value; let i = index" [formGroupName]="i">
<td>
<input class="form-control" id="p_unit_price " type="number" class="validate" [value]="sale.p_unit_price" ng-change="tot()">
</td>
<td>
<input class="form-control" type="text" formControlName="p_quantity" id="p_quantity" name="p_quantity" [value]="sale.p_quantity" ng-change="tot()">
</td>
<td>
<div class="input-field col s2">
<input class="form-control" formControlName="p_description" id="p_description" type="text" class="validate" [value]="sale.p_description">
</div>
</td>
<td>
<input class="form-control" type="text" formControlName="p_subtotal" id="p_subtotal" name="p_subtotal" [value]="(sale.p_subtotal)">
</td>
<td>
</td>
</tr>
</tbody>
</table>
</div>
<br>
<br>
<div class="row">
<div class="input-field col s2" style="float: right;">
Total: {{Total}} ALL
<input class="form-control" formControlName="total" id="total" type="text" class="validate" [value]="totale">
</div>
<div class="form-control" class="input-field col s2" style="float: right;">
Amount Paid:
<input class="form-control" formControlName="amount_paid" id="amount_paid" type="text" class="validate">
</div>
<div class="input-field col s2" style="float: right;">
Subtotal:
<input formControlName="subtotal" id="subtotal" type="text" class="validate" [value]="Total">
</div>
</div>
</form>
app.component.ts
tot() {
return this.products
.map(pro => pro.p_unit_price * pro.p_quantity)
.reduce((a, b) => a + b, 0);
}
Despite modifying the quantity or price, the total remains unchanged. Seeking suggestions or explanations regarding any issues in my code would be greatly appreciated.
Your assistance is highly valued. Thank you!