触发onChange时获取复选框状态

Question

I'm playing in angular and bootstrap. The question is very trivial. I have input element in my html

  <label><input  (change)="callFilt()"  type="checkbox" 
    value="">{{item.name}}</label> 

I want to get state of checkbox in my callFilt method.I see that it's possible via ng-model,but I dont want to use any other directives here,is there way to send state of the checkbox?

Neither I want to set id of checkbox and get state via ID in my js code.

Answer 1

You can create a variabile reference in your markup using the sintax #myInputVariabile and pass it to the function callFilt(checkInput). something like:

<label><input  (change)="callFilt(checkInput)"

#checkInput type="checkbox" value="">{{item.name}}

   callFilt(element) {
    console.log(element.checked)
  }

Answer 2

You can get the value buy putting this inside method

<label><input  (change)="callFilt(this)"  type="checkbox" 
    value="">{{item.name}}</label>

.Now in function

 callFilt(e) {
    console.log(e.checked); // or 
    console.log(e.value); //depending input type
  }