How to calculate total amount with discount, service charge and other Taxes

 How to calculate total amount with discount, service charge and other Taxes 

<div style="width:120px; margin:auto; text-align:center">

  <form>

    <label>Amount</label>

    <input type="number" [(ngModel)]="amt" name="amt"

      placeholder="Total" (ngModelChange)="updateValues()" />

    <br /><br />

    <label>Discount %</label>

    <input type="number" [(ngModel)]="discount" name="discount"

      placeholder="Discount %" (ngModelChange)="updateValues()" />

    <br /><br />

    <label>Total Amount</label>

    <input type="number" [(ngModel)]="totalamount" name="totalamount"

      placeholder="Total Amount" readonly />

    <br /><br />

    <label>Service</label>

    <input type="number" [(ngModel)]="servCharge" name="servCharge"

      placeholder="5%" readonly />

    <br /><br />

    <label>Tax</label>

    <input type="number" [(ngModel)]="TSCharge" name="TSCharge"

      placeholder="5%" readonly />

    <br />

    <h3>Total : {{ getTotal() }}</h3>

  </form>

</div>

TS

-----

import { Component } from '@angular/core';

@Component({

  selector: 'my-app',

  templateUrl: './app.component.html',

  styleUrls: ['./app.component.css'],

})

export class AppComponent {

  amt: number;

  servCharge: number;

  TSCharge: number;

  discount: number;

  totalamount: number;

  updateValues() {

    this.totalamount = this.amt - this.amt * (this.discount / 100);

    this.servCharge = this.totalamount * 0.05; // Assuming service charge is 5%

    this.TSCharge = this.totalamount * 0.05; // Assuming tax is 5%

  }

    getTotal() {

    // Check if any of the values are not valid numbers

    if ( isNaN(this.totalamount) || isNaN(this.servCharge) || isNaN(this.TSCharge) ) {

      return 0; // Return 0 if any of the values are not valid numbers

    } else {

      return this.totalamount + this.servCharge + this.TSCharge; // Perform the addition if all values are valid numbers

    }

  }

}

OUT PUT

-------------