复选框更改事件收到未定义的值

Question

我有一个在Angular 7应用程序中实现的复选框。当选中或取消选中复选框时，我需要在change事件中捕获true或false值。 此刻，我正在获得未定义的值。

html

<div>
    <input type="checkbox" id="chk" style="width: 13px; height: 13px;" checked="checked" (change)="isInvestedSelected(s)" />
    <label for="chkInvested">Invested</label>

</div>

组件

isInvestedSelected(s) {
    console.log(s);
}

Answer 1

您应该在模板内传递$ event

<div>
    <input type="checkbox" id="chk" style="width: 13px; height: 13px;" checked="checked" (change)="isInvestedSelected($event)" />
    <label for="chkInvested">Invested</label>
</div>

并在您的方法中获得价值：

isInvestedSelected(event) {
    console.log(event.target.checked);
}

Answer 2

我会改变 (change)="isInvestedSelected(s)" 至： (click)="isInvestedSelected($event)"

您可以通过函数捕获click事件，并且可以实现切换或仅更改布尔变量。

Answer 3

代替 (change)="isInvestedSelected(s) 你应该使用 (change)="isInvestedSelected($event)。