Question

我设置了一个反应角度表单，可以通过按钮添加行。我想添加选择所有行的功能。

每一行都有一个与之关联的复选框，可根据状态（T或F）更改对象中的值。如果选中所有行，则选择全部＆＃39;复选框变为T else F.问题是当我选中“全部选择”时。复选框，所有行的值都会更改为＆＃39; select all＆＃39;但它们各自的复选框保持不变。我使用了材料角度复选框。

我知道双向数据绑定我可能很容易解决这个问题，但我想知道是否有一种反应形式的方法。

<div class="checkbox-container">
  <mat-checkbox formControlName="selected (change)="checkAllSelected()"></mat-checkbox>
</div>
<mat-form-field>
  <input matInput formControlName="name">
</mat-form-field>

Answer 1

看起来我使用Object.assign解决了它。

selectAll(val: any) {
   const newRows = this.form.get('itemRows').value
     .map(row => Object.assign(row, {selected: val}));

   this.form.controls['itemRows'].setValue(newRows);
}

当我选择＆＃39;全选＆＃39;复选框，我称之为此功能。我的第一次尝试纯粹只是覆盖了那样没有效果的价值。

row => row.selected = val

如何使角度材料复选框对反应中的程序性值变化做出反应？

1 个答案: