Pass checkbox value to angular's ng-click

You can do the following things:

  • Use ng-model if you want to bind a html component to angular scope
  • Change ng-click to ng-change
  • If you have to bind some value upon checking and un-checking the checkbox use ng-true-value="someValue" and ng-false-value="someValue"

The order of execution of ng-click and ng-model is ambiguous since they do not define clear priorities. Instead you should use ng-change or a $watch on the $scope to ensure that you obtain the correct values of the model variable.

Courtesy of musically_ut

Working Demo

<input type="checkbox" id="cb1" ng-model="check" ng-change="checkAll(check)" ng-true-value="YES" ng-false-value="NO"/> Citizen

Today i wanted to do the same thing and i see nobody answered the actual question. This is against the Angular philosophy, but you can replace "this.value" with "$event.target.checked" :

<input type="checkbox" id="cb1" ng-click="checkAll($event.target.checked)" />

Assigning an ng-model to it will return boolean value depending upon the change to it:

<input type="checkbox" id="cb1" ng-model="checkValue" ng-change="checkAll(checkValue)" />

Better to use ng-change rather than ng-click