AngularJs Check All Uncheck All

AngularJs Check All Uncheck All : Sometimes we need functionality to check all and uncheck all checkboxes. Here in this tutorial we are going to explain how you can create this functionality in AnagularJs. You can also use our online editor to edit and run demo.

AngularJs Check All Uncheck All | Select All | Unselect All Example

Unlike jQuery you don’t need to put extra effort to check/uncheck all checkboxes in AngularJs, It is very easy and simple. Here is a simple example for check and uncheck all functionality. –

AngularJs Check All Uncheck All | Example:

<!DOCTYPE html>
<html lang="en">
 <script src="//"></script>
var myApp = angular.module("myApp", []);
 myApp.controller("myController", function($scope) {
  $scope.Items = [{
        Name: "Item 1"
    }, {
        Name: "Item 2"
    }, {
        Name: "Item 3"
    }, {
        Name: "Item 4"
    }, {
        Name: "Item 5"
    }, {
        Name: "Item 6"
    }, {
        Name: "Item 7"
        Name: "Item 8"

<div ng-app="myApp">  
<div ng-controller="myController"> 
        <td><input type="checkbox" ng-model="selectedAll"  />Select All Items </td>    
        <tr ng-repeat="item in Items">
                <input type="checkbox" ng-checked="selectedAll" />


Try it »

If you run the above example it will produce output something like this –

AngularJs Check All Uncheck All


Add Comment

📖 Read More