angular2材质复选框是否选中

【问题标题】：angular2 material checkbox checked or notangular2材质复选框是否选中
【发布时间】：2017-12-24 04:29:37
【问题描述】：

我在材质上使用 angular 2。我想在单击复选框时选中或不选中材料复选框。我通过将点击事件传递给组件函数来完成。但是在使用材质复选框时它不起作用。仅在使用 html 复选框时有效。

<md-checkbox class="example-radio-button" [value]="hobby 1" (click)="hobbyClicked($event)">
    hobby 1
</md-checkbox>


hobbyClicked(evt){
    console.log(evt.target.checked);   // undefined
}

【问题讨论】：

标签： javascript angular checkbox angular-material

【解决方案1】：

使用[ngModel] & (change) 指令，根据复选框是否被选中，你可以从DOM中检索一个值。

<md-checkbox class="example-radio-button" 
  [ngModel]="hobby" value="hoby 1"
  (change)="hobbyClicked($event)">
    hobby 1
</md-checkbox>

代码

hobbyClicked(evt){
  console.log(evt.checked ? evt.source.value: '');   // undefined
}

Demo

【讨论】：