如何知道复选框是否被选中？答案

【问题标题】：How to know if a checkbox is checked?如何知道复选框是否被选中？
【发布时间】：2016-09-16 15:05:40
【问题描述】：

代码如下：

<input type="checkbox" value="Blue" (click)="var=$event.target.getAttribute('value')" />

当我在控制台上打印var 时，我得到了复选框“Blue”的value，但是如果复选框被选中，我想得到什么呢？

我已经尝试过了，但我得到了undefined:

<input type="checkbox" value="Blue" (click)="var=$event.target.getAttribute('checked')" />

【问题讨论】：

ngModel 可能是获取用户输入的更好解决方案。
我的目标是拥有多个复选框并将复选框状态和值发送到管道。我不认为 ngModel 在这种情况下会很好，因为它会绑定到所有复选框，对吗？
我的意思是如果我点击一个复选框，所有其他复选框都会被选中/点击
如果您为每个复选框使用不同的模型，则不会。例如，<input type="checkbox" value="Blue" [(ngModel)]="blue" 和<input type="checkbox" value="Red" [(ngModel)]="red" 等将在控制器中设置这些字段（参见我链接页面中的第一个示例）。
这样我就必须向管道发送 2 个参数：红色和蓝色，对吧？我想通过将 var 转换为包含复选框值和状态的对象来发送一个。

【解决方案1】：

如果您想将每个输入的复选框的名称和值存储在键值对中，ngModel 是一个很好的工具。

如果你的html是这样的：

<input type="checkbox" value="Red" [(ngModel)]="colors['red']"
<input type="checkbox" value="Blue" [(ngModel)]="colors['blue']"

你可以把它放在控制器里：

colors = {};

用户在复选框上输入后，对象的值将更新为：

colors = {
    red: true,
    blue: false
};

【讨论】：

【解决方案2】：

这就是答案：

<input type="checkbox" value="Blue" (click)="var=$event.target.checked" />

【讨论】：