html - 选择所有带有 Angular JS 的复选框

标签 html angularjs checkbox selectall

我试图用一个复选框选中所有复选框。但是该怎么做呢?

这是我的 HTML:

    <input type="checkbox" ng-model="selectAll" ng-click="checkAll()" />

<!-- userlist --> 
    <!--<div id="scrollArea" ng-controller="ScrollController">-->
    <table class="table">
      <tr>
          <th>User ID</th>
          <th>User Name</th>
          <th>Select</th>    
     </tr>
     <tr ng-repeat="user in users | filter:search">
        <td>{{user.id}}</td>
        <td>{{user.name}}</td>
        <td><input type="checkbox" ng-click="usersetting(user)" ng-model="user.select"></td>
        <td><tt>{{user.select}}</tt><br/></td>
     </tr>
    </table>

我创建了一个额外的复选框来选择和取消选择所有复选框。

JS:

.controller('UsersCtrl', function($scope, $http){
    $http.get('users.json').then(function(usersResponse) {
      $scope.users = usersResponse.data;
    });

      $scope.checkAll = function () {
            angular.forEach($scope.users, function (user) {
                user.select = true;
                });
            };  
 });

我也试过了,但是没有一个对我有用:(

  $scope.checkAll = function () {
        angular.forEach($scope.users, function (user) {
            user.select = $scope.selectAll;
        });
    };  

最佳答案

您错过了带有 ng-controllerng-app 以及 angular.module 的容器 div。

user.select = $scope.selectAll 是正确的变体。

https://jsfiddle.net/0vb4gapj/1/

关于html - 选择所有带有 Angular JS 的复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36059701/

相关文章:

javascript - CSS 变量和转换

javascript - AngularJS中如何拼接所有item

javascript - 除非选中单选按钮,否则如何使复选框变灰?

javascript - 将对象添加到数组中

javascript - 这个 AngularJS 过滤器表达式是哪个 javascript 构造?

php - 添加重置按钮以使用 PHP 或 javascript 重置复选框

html - 对齐自定义复选框问题 css

javascript - 如何改变jquery中span的值

css - 如何在不制作空白行的情况下将此横幅添加到我的页面?

javascript - jQuery 添加子元素到新创建的元素