why checkbox is showing always false value

Question

I have html structure like this

<div ng-controller="parentCtrl">
    <div ng-controller="childCtrl">
        <input ng-model="selectAll" id="selectAll" type="checkbox" ng-click="selectAllChange()"></div>
    </div>
</div>

here is the js code

function parentCtrl($scope) {
    $scope.selectAll = false;

    $scope.selectAllChange = function() {       

        if($scope.selectAll){
            console.log('ttt');
        }
        else
            console.log('fff');       
    }   
}

on click of checkbox whether its checked or not, in console I am always getting fff How to know that checkbox was checked or not in this situation?

Khanh TO · Answer 1 · 2014-05-17T08:31:16.367

In your code, the ng-model binds to the childCtrl's scope, but your code inside parentCtrl is accessing the scope created by parentCtrl.

You could try this instead of $scope to get scope triggering the function:

if(this.selectAll){

And use ng-change instead.

ng-change="selectAllChange()"

click and change events really mean different things: click means mouse down and mouse up on the same element, change means the value has changed. When you use ng-click, ng-model does not update the underlying value yet.

DEMO

why checkbox is showing always false value

1 Answers1