Check All , UnCheck All - AngularJs

Code to check and uncheck all using angularjs

by santhosh lanka

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.js"></script>
<div>
    <ul ng-controller="checkboxController">
        <li>Check All
            <input type="checkbox" ng-model="allSelected" ng-model-options="{getterSetter: true}"/>
        </li>
        <li ng-repeat="item in Items">
            <label>{{item.Name}}
                <input type="checkbox" ng-model="item.Selected" />
            </label>
            {{item.Selected}}
        </li>
    </ul>
</div>

JavaScript

angular.module("CheckAllModule", [])
    .controller("checkboxController", function checkboxController($scope) {
        
    $scope.Items = [{
        Name: "Item one"
    }, {
        Name: "Item two"
    }, {
        Name: "Item three"
    }];

    var getAllSelected = function () {
        var selectedItems = $scope.Items.filter(function (item) {
            return item.Selected;
        });
        
        return selectedItems.length === $scope.Items.length;
    }
    
    var setAllSelected = function (value) {
        angular.forEach($scope.Items, function (item) {
            item.Selected = value;
        });
    }

    $scope.allSelected = function (value) {
        if (value !== undefined) {
            return setAllSelected(value);
        } else {
            return getAllSelected();
        }
    }


});