Question

我有一个复选框，我需要该值来反映数据模型中的布尔值，并忽略用户更改它的尝试。

以下是我的设置示例：

数据模型

const item = {label: 'test', active: false, selected: false};

我尝试过各种输入的模板：

<li (click)="item.selected = !item.selected" [class.selected]="item.selected">
  <input type="checkbox" [ngModel]="item.active">
  <input type="checkbox" [value]="item.active">
  <input type="checkbox" [checked]="item.active">
  {{item.label}}
</li>

由于数据中的活动状态没有被更改（不是双向绑定），我希望复选框始终保持未检查状态，尽管用户试图检查它。

但是，情况并非如此。用户仍然可以选中该框，并且活动状态仍为false，但所选状态会发生变化。什么阻止变更检测看到复选框DOM状态与模型更改时的模型不同？

更改检测是否仅监视特定的DOM元素，并且由于活动状态未更改，因此假定DOM未受影响？

如何进行变更检测以查看此更改并相应地使用模型值？

Answer 1

您可以在(click)="false"标记中添加input。你停止在DOM中切换复选框。

<input type="checkbox" [ngModel]="item.active" (click)="false">{{item.label}}

这是Plunker Demo。

Answer 2

我建议一起禁用复选框

<input type="checkbox" [ngModel]="item.active" disabled="true">

Angular - 复选框不保持模型值

2 个答案: