Angularjs检查范围内的所有内容

Angularjs Check all in scope of scope

本文关键字：检查 范围内 Angularjs      更新时间：2024-04-21

我希望在循环的循环中选中所有复选框。但是怎么做呢？

<section ng-repeat="user in users">
    <p>{{ user.name }}</p>
    <label for="#">
        <input type="checkbox" ng-click="checkAllRoles(user)"> CHECK ALL
    </label>
    <ul>
        <li ng-repeat="role in user.roles">
            <input type="checkbox" value="{{ role.id }}"> {{ role.name }}
        </li>
    </ul>
</section>

您可以使用ngChange处理程序循环所有角色，更改某些属性，如绑定到ngModel指令的checked：

$scope.checkAllRoles = function(user) {
    user.roles.forEach(function(role) {
        role.checked = user.allChecked;
    });
};

HTML在哪里：

<section ng-repeat="user in users">
    <p>{{ user.name }}</p>
    <label for="#">
        <input type="checkbox" ng-model="user.allChecked" ng-change="checkAllRoles(user)"> CHECK ALL
    </label>
    <ul>
        <li ng-repeat="role in user.roles">
            <input type="checkbox" value="{{ role.id }}" ng-model="role.checked">{{ role.name }}
        </li>
    </ul>
</section>

演示：http://plnkr.co/edit/a3I4DKyz6DRUKTIt50Xj?p=preview

只需将选中添加到输入的末尾即可。

<ul>
   <li ng-repeat="role in user.roles">
     <input type="checkbox" value="{{ role.id }}" checked> {{ role.name }}
   </li>
</ul>
相关文章：