为什么 *ngFor 中的 mat-checkbox 没有从模型中获取最新的 [checked] 值？

Question

<ng-container *ngFor="let item of items">
     >>>>>>>>LINE 2>>>>>>>>>> {{item.checkedOrUnchecked}}
     <mat-checkbox [checked]="item.checkedOrUnchecked"></mat-checkbox>

上述代码中的第 2 行始终与在其他地方所做的更改同步。

但是，mat-checkbox 不会更新为 true/false。它在这里失去了上下文。即使 *ngFor 为每次迭代创建一个子上下文，当 LINE 2 能够选择最新更新时，为什么 mat-checkbox 不能同步。

我注意到的一件事是，如果 item.checkedOrUnchecked 的初始值为 false，如果将其更改为 true，则选中 mat-checkbox。但是，从 true 到 false 或 false 到 true 进一步切换 item.checkedOrUnchecked 没有任何影响。

问题可以在这里复制https://stackblitz.com/edit/angular-material2-checkbox-issue-zyjhd3

请高人指教。

Answer 1

改变这个：

[checked]="item.checkedOrUnchecked"

到

[(ngModel)]="item.checkedOrUnchecked"

---

这是它的工作示例，请看一下：

https://stackblitz.com/edit/angular-material2-checkbox-issue

---

您的演示有问题：https://stackblitz.com/edit/angular-material2-checkbox-issue-zyjhd3

问题：

1) 缺少 let i =index; 来自 *ngFor="let property of properties;let i =index;"

2) 所以没有从这里传递正确的值saveProperty($event, i)

3) this.properties[index][key] = property[key] , property[key] 是 string 不是 boolean ，所以需要转成布尔值

已解决：https://stackblitz.com/edit/angular-material2-checkbox-issue-tbutvp