为什么切换复选框返回 false？

Question

我在页面上显示复选框。

当我点击它时，它被更改为true/false 。 如果为真，则应检查 cehckbox。

问题是当我点击第一个复选框时它起作用，当我点击第二个时我出错了completed: false in object {id: 2, content: "CSS", completed: false} ，尽管复选框被选中：

图 1

代码是通过链接到stackblitz

Answer 1

您使用的 ngModel 指令错了它的 [(ngModel)] 而不是 ([ngModel])

Answer 2

复选框有一个 state（选中或不选中），而不是一个值。 如果您在单击后更改 model 值，请仅使用复选框显示当前 state。所以我会更改：

[(ngModel)]="todo.completed"

到[checked]="todo.completed"