角度2：使用ngModel求和2個數字

Question

我正在嘗試將ngModel變量與另一個變量求和，並將結果顯示為插值，但我看不到結果動態更新。

這是我的輸入文本字段：

<input type="text" [(ngModel)]='downpayment1' class="form-control" placeholder="Option 1 Down Payment (%)">

打字稿代碼如下所示：

  downpayment1 = 0;
  result = this.downpayment1 + 20;

更改預付定金1的輸入也應更改{{result}}，但不會發生。 用Angular1評估一個數字表達式要容易得多，但是我用Angular2找不到任何這樣的例子。 我在這里做錯了什么？

Answer 1

如果我正確理解您要實現的目標是：

• 顯示與一些固定值求和 ngModel值
• 保持ngModel的值不受此固定值的影響...

那就是我的答案

@Component({
    selector: 'my-app',
    template: `
    <h1>Summing example</h1>
    <h2>Fixed value {{fixedValue}}</h2>
    <input type="number" [(ngModel)]='downpayment1' class="form-control" placeholder="Option 1 Down Payment (%)">

    <h2>Sum : {{ fixedValue + downpayment1 }}</h2>
    `
})
export class AppComponent {
    public fixedValue: number = 20;
    public downpayment1: number = 0;
}