Angular: Как отобразить и сделать реактивную переменную рассчитанной из других переменных?

Question

Я работаю над приложением баланса и использую Angular. У меня есть 3 переменные A, B и C, такие что C = A + B. Я хочу отобразить C, чтобы он автоматически обновлялся при изменении A или B. Я не хочу отображать только {{A + B}}, потому что C будет использоваться в других формулах. Проблема в том, что C вообще не обновляется автоматически. Я прошу вашей помощи.

HTML код

<input type="number" [(ngModel)]="a">
<input type="number" [(ngModel)]="b">
<span>{{c}}</span>

Код TS

export class EtatsfinanciersComponent{
  @Input() a: number = 0;
  @Input() b: number = 15451;

  c: number = a + b

  constructor() {
  }
}

Answer 1

Используйте функцию для обновления значения c,

component.ts:

update(){
    this.c = this.a + this.b;
}

component. html:

<input type="number" [(ngModel)]="a" (change)="update()">
<input type="number" [(ngModel)]="b" (change)="update()">
<span>{{c}}</span>

Демонстрация: https://stackblitz.com/edit/angular-uqf6fc