ng-models not binding when ng-checked

Question

I have a Parent checkbox that gets checked when a child checkbox is clicked. I want this parent checkbox to in-turn bind with a third checkbox. But the 2 way binding is not working when the change is due to ng-checked. Here is the template:

<div><input type="checkbox" ng-checked="childCheckbox" ng-model="parentCheckbox" /> Parent Checkbox</div>
<div><input type="checkbox" ng-model="childCheckbox" /> Child Checkbox</div>
<div><input type="checkbox" ng-model="parentCheckbox" /> A third Checkbox binding with Parent Checkbox</div>

Here is the working sample in jsfiddle: http://jsfiddle.net/Alien_time/vy5UM/1/

In order words, when parent checkbox is checked by clicking, the ng-model binds with the 3rd checkbox. But if the parent checkbox get checked due to ng-checked, the third checkbox is not updating the change. How can I achieve this in Angular?

Answer 1

No, I don't think it's possible without extra JS.

However, I made a version that does use a bit of JS and works fine.

<div><input type="checkbox" ng-click="clickOthers()" ng-model="childCheckbox" /> Child Checkbox</div>

(added to controller)

$scope.clickOthers = function () {
    $scope.parentCheckbox = $scope.childCheckbox;
}