在角度 2 中单击时访问复选框值

Question

我有这个复选框，我想看看它是否通过

ngModel

绑定进行检查。
当我调用

console.log(activeCheckbox);

时，我可以看到

ngmodel

及其 value 属性在控制台中设置为 true。
但是当我调用 console.log(activeCheckbox.value); 时紧随其后或单独，该值未定义？

有人知道这里发生了什么事吗？

<input #activeCheckbox="ngModel" (click)="checkIfActive(activeCheckbox)"
    [disabled]="pageStatus==4" [ngModel]="premiumContententPackage.active"    
    name="premiumContententPackageActive" id="premiumContententPackageActive" 
    type="checkbox" >

checkIfActive(activeCheckbox){
   console.log(activeCheckbox);
   console.log(activeCheckbox.value);
}

Answer 1

您可以监听输入更改事件并获取状态，或者事件将其分配给任何变量

<input type="checkbox" [checked]="isChecked" (change)="changed($event)"/>


changed(evt) {
    this.isChecked = evt.target.checked;
    alert(evt.target.checked)
  }

https://plnkr.co/edit/rSxR6f88NHMBKoqDtw08?p=preview

编辑：您的代码看不到更改的原因是因为

click

和

change

事件不同 - 单击事件将在输入更改之前被调用。请参阅https://plnkr.co/edit/rSxR6f88NHMBKoqDtw08?p=preview

Answer 2

使之前的答案对我有用的小更改是将 evt.target 转换为 HTMLInputElement：

changed(evt){
    this.isChecked  = (<HTMLInputElement>evt.target).checked    
    alert(evt.target.checked)
}