選擇AngularJS中的所有複選框

Question

我有一個像這樣的全選複選框和列表複選框。

一個複選框列表從

$scope.contacts = [ 
     {"name": "Bambizo", "check": false}, 
     {"name": "Jimmy", "check": false}, 
     {"name": "Tommy", "check": false}, 
     {"name": "Nicky", "check": false} 
]; 

我想接收數據時，我檢查選擇所有複選框，使其在下面列表中的所有複選框被選中或取消選中。在這裏，我的代碼：

選擇全部複選框：

<input type="checkbox" ng-model="checkAllContact" ng-change="checkAllContact(checkAllContact)"> 

checkAllContact功能：

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

     if (allChecked = true){ 
      for(i = 0; i< $scope.contacts.length; i++){ 
       $scope.contacts[i].check = false; 
      } 
     }else{ 
      for(i = 0; i< $scope.contacts.length; i++){ 
       $scope.contacts[i].check = true; 
      }  
     } 
    } 

但是當我運行，並單擊選擇所有複選框。它使一個錯誤：

如何解決它或有任何其他的方式做到這一點？謝謝

Answer 1

ng-model="checkAllContact" &方法checkAllContact具有相同的名稱。

checkAllContact範圍變量覆蓋checkAllContact。

您需要更改您的函數名稱才能解決問題。

Answer 2

您的函數名稱和變量名稱（ng-model）都相同，請更改其中之一。

此外，你可以做一個更簡單的方法，例如。

HTML：

<input type="checkbox" ng-model="checkAllContact1" ng-change="checkAllContact()"> 
<div ng-repeat="item in contacts"> 
    <input type="checkbox" ng-model="item.check"/> 
</div> 

JS：

$scope.checkAllContact = function(){ 
    if ($scope.checkAllContact1) { 
     $scope.checkAllContact1 = true; 
    } else { 
     $scope.checkAllContact1 = false; 
    } 
    angular.forEach($scope.contacts, function (item) { 
     item.check = $scope.checkAllContact1; 
    }); 
} 

見Fiddle