mardi 23 juin 2015

Check/ Uncheck All checkboxes - AngularJS ng-repeat

I have a structure which looks like this: http://ift.tt/1RtPkS0

<div>
<ul ng-controller="checkboxController">
    <li>Check All
        <input type="checkbox" ng-model="selectedAll" ng-click="checkAll()" />
    </li>
    <li ng-repeat="item in Items">
        <label>{{item.Name}}
            <input type="checkbox" ng-model="item.Selected" />
        </label>
    </li>
</ul>
</div>

angular.module("CheckAllModule", [])
.controller("checkboxController", function checkboxController($scope) {


$scope.Items = [{
    Name: "Item one"
}, {
    Name: "Item two"
}, {
    Name: "Item three"
}];
$scope.checkAll = function () {
    if ($scope.selectedAll) {
        $scope.selectedAll = true;
    } else {
        $scope.selectedAll = false;
    }
    angular.forEach($scope.Items, function (item) {
        item.Selected = $scope.selectedAll;
    });

};


});

When check all is selected or deselected, all other checkboxes are selected. But when "Check All" is selected, and I deselect one of the items, I want "Check All" to be deselected.

Thanks in advance!

(PS: Thanks to deeptechtons for the JSFiddle)




Aucun commentaire:

Enregistrer un commentaire