在AngularJS中选择All Checkbox

时间:2015-05-08 09:29:15

标签: javascript angularjs checkbox angularjs-ng-change

我有一个选择所有复选框和列表复选框,如下所示 Select All Checkbox

复选框列表从

接收数据
$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;
            }    
        }
    }

但是当我运行并单击全选复选框时。它出错了:

Error when after click checkbox

如何解决它或有任何其他方法来做到这一点?感谢

2 个答案:

答案 0 :(得分:2)

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

checkAllContact范围变量覆盖checkAllContact

您需要更改功能名称才能解决问题。

答案 1 :(得分:1)

您的函数名称和变量名称(ng-model)都相同,请更改其中一个。

你也可以用更简单的方式来做,例如。

HTML:

LLs_SelectionChange(....) 
{
String s= lls.SelectedItem;
MessageBox.close();
NavigationService.Navigate(new Uri("/YourPage.xaml?country="+s),UriKind.RelativeorAbsolute);
}

JS:

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

请参阅示例Fiddle