Ionic – How to do Check All with Ion-Checkbox


This blog represents code sample to achieve “Check all” or “Select all” using ION-Checkbox.

AngularJS/Ionic Controller Code to Check All

Say, you have a list of contacts (name) with check boxes. What you want is to achieve “check all” when you check one checkbox. $scope.allcontacts is a temporary object to capture the checkbox checked value.

$scope.allcontacts = {};
$scope.allcontacts.checked = false;
$scope.checkAll = function() {
      if ($scope.allcontacts.checked) {
        $scope.allcontacts.checked = true;
      } else {
        $scope.allcontacts.checked = false;
    for (var i=0; i < $scope.contacts.length; i++) {
      $scope.contacts[i].checked = $scope.allcontacts.checked;

HTML Code including Ion-Checkbox to Achieve “Check All”

<ion-checkbox class="item-checkbox-right" ng-model="allcontacts.checked" ng-checked="allcontacts.checked" ng-click="checkAll()">
        All Contacts
      <ion-checkbox ng-repeat="contact in contacts"
                    ng-checked="contact.checked" class="item-checkbox-right">
Ajitesh Kumar
Follow me

Leave A Reply

Time limit is exhausted. Please reload the CAPTCHA.