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

Posted 2023-03-05

【中文标题】在角度 2 中单击时访问复选框值

【英文标题】：Accessing a checkbox value on click in angular 2

【发布时间】：2018-03-16 23:24:40

【问题描述】：

我有这个复选框，我想看看它是否通过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);

【参考方案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 事件不同 - click 事件将在输入更改之前被调用。见https://plnkr.co/edit/rSxR6f88NHMBKoqDtw08?p=preview

【讨论】：

click 和change 事件不同，点击事件会在输入改变之前被调用plnkr.co/edit/rSxR6f88NHMBKoqDtw08?p=preview