Angular 固定从另一行以反应形式读取的角度值

如何修复返回的此更改？更改为支付金额-总金额。问题是，在我计算费率和数量后，它不会改变。它只会在我更改了付款金额输入后才更改值？ 这是我做的一个小东西

---

您当前所做的是混合模板驱动表单和反应式表单，尝试将

[ngModel]

输入附加到表单控件。您要做的是使用反应式表单API设置表单控件的值，特别是。这允许您从组件类更新表单控件的值

我已将您的plunkr分叉并使用工作代码进行了更新：

我将在这里提供重要的内容供参考：

this.invoiceForm.get('itemRows').valueChanges.subscribe(values => {
    this.invoiceForm.get('summed')
      .setValue(values.reduce((acc, cur) => acc + cur.itemamt, 0));
});

this.invoiceForm.get('summed').valueChanges.subscribe(value => {
  this.setChange();
});

this.invoiceForm.get('amount').valueChanges.subscribe(() => {
  this.setChange();
});

然后将

setChange

方法定义为：

setChange(): void {
  const change = this.invoiceForm.get('amount').value - 
                 this.invoiceForm.get('summed').value;
  this.invoiceForm.get('change').setValue(change);
} 

---

在这里了解更多关于反应式表单的信息：。

我认为您还应该在itemRows中使用valueChanges，因为如果您在速率或数量中更改某些内容，它将影响总数。你能编辑你的代码吗？谢谢你明白我的意思了吗？顺便问一下，当你混合使用模板驱动和反应式表单时会发生什么？不客气：）我知道两者都有优点和缺点，在相同的表单中混合它们不是好的做法。我可以提出一个单独的问题。很多资源都在谈论差异（这里有一个很好的链接：），但没有太多的资源在谈论两者的混合。我想最主要的是被动的是同步的，而模板驱动本质上是异步的。混合异步+同步=Zalgo。不惜一切代价避开zalgo在这个问题上你能帮我吗。谢谢。

setChange(): void {
  const change = this.invoiceForm.get('amount').value - 
                 this.invoiceForm.get('summed').value;
  this.invoiceForm.get('change').setValue(change);
}