2016-07-30 11 views
0

Ich habe Probleme, eine Lösung zu finden, mit der ich einfach alle Kontrollkästchen mit AngularJS deaktivieren kann. Ich benutze ein einfaches ng-repeat, um Checkboxen zu erstellen und möchte eine Schaltfläche, um alle zu löschen.Deaktivieren Sie alle Kontrollkästchen in AngularJS

Ich habe versucht, das ng-Modell einige Male zu ändern, aber immer Fehler zu bekommen, da ich die ng-change-Funktion verwende. Gibt es eine Möglichkeit, eine Funktion namens reset() in der Steuerung zu machen, um alle Kontrollkästchen zu löschen (auch wenn es in einer for-Schleife durch jede nach Namen durchlaufen)?

Für referense

$scope.blocks = ["Lambda","Tokenization","Hadoop"]; 
+0

http://jsfiddle.net/VSph2/283/ – Naveen

Antwort

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

var app=angular.module("CheckAllModule", []); 
app.controller("checkboxController", functioncheckboxController($scope) { 
$scope.Items = [{ 
    Name: "Item one" 
}, { 
    Name: "Item two" 
}, { 
    Name: "Item three" 
}]; 
$scope.checkAll = function (Count) { 
    angular.forEach($scope.Items, function (item) { 
    item.Selected = false; 
    }); 
    }; 
    }); 

prüfen mit this.I denke, das wird Ihnen helfen,

Demo Link

+0

Dank, dass gearbeitet ! –

0

versuchen, diese Methode.

var app = angular.module('plunker', []); 
 

 
app.controller('mainCtrl', function($scope) { 
 
$scope.blocks = ["Lambda","Tokenization","Hadoop"]; 
 
    $scope.checkBlocks = []; 
 
    $scope.filter = function(b){ 
 
    
 
    } 
 
    $scope.reset= function(){ 
 
    $scope.checkBlocks = []; 
 
    } 
 
    
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="plunker" ng-controller="mainCtrl"> 
 
    <div class="form-group"> <!-- Checkbox Group !--> 
 
        <label class="control-label">What are your requirements</label> 
 
        <div class="checkbox" ng-repeat="block in blocks"> 
 
         <label> 
 
         <input type="checkbox" ng-checked="checkBlocks[block]" ng-model='checkBlocks[block]' name="block" value="block" ng-change="filter(block)"> 
 
         {{block}} 
 
         </label> 
 
        </div> 
 
       </div> 
 

 
       <div> 
 
        <input type="button" class="btn btn-primary " name="Clear" ng-click="reset()" value="Reset"> </input> 
 
       </div> 
 
    
 
</body>

Verwandte Themen