Question

我使用ng-repeat创建了一个带有不同复选框选项的过滤器。我想添加一个选择所有复选框，但我收到一些错误。下面是html和代码：

<accordion>

    <accordion-group  is-open="group.open">
        <accordion-heading>
            <i ng-class="{'icon-minus-sign':series[0].open,'icon-plus-sign':!series[0].open }"></i>
            <span class="title-pos" >{{series[0].title}}</span>
        </accordion-heading>


     <div class="filertType"  ng-repeat="chk in series[0].content">


      <input type="checkbox" id="{{ 'c' + $index }}" name="cc" /> 
      <label for="{{ 'c' + $index }}"><span></span> {{chk.text}}</label>
    </div>



     </accordion-group>


  </accordion>

angular.module('main',['ui.bootstrap'])
  .controller('AppCtrl', function($scope){

  $scope.series = [
    {
      "title":"Series",
      "content": [{"text":"Select All"},
      {"text":"1 Series"},
                      {"text":"2 Series"},
           {"text":"3 Series"},
            {"text":"4 Series"},
             {"text":"5 Series"},
              {"text":"6 Series"},
               {"text":"7 Series"},
                {"text":"X Series"},
                 {"text":"Z Series"},
                  {"text":"M Series"},
                          {"text":"Hybrid"}],
      "open":true
    }
    ];

Answer 1

我认为您可以在ng-checked="allSelected"循环中的每个复选框中添加ng-repeat。接下来，在具有ng-model="allSelected"

的某个位置添加新的“全选”复选框

修改这是一个小提琴，同样的方法：http://jsfiddle.net/Lr8rdr4c/

<body ng-app="TestApp"> <div ng-controller="TestController"> <div ng-repeat="checkbox in checks"> <input type="checkbox" ng-checked="allSelected"/>{{checkbox}} </div> <button ng-click="toggleChecks()">Select All</button> </div> </body>

JS

var app = angular.module('TestApp',[]); app.controller('TestController',function($scope) { $scope.checks = ['test 1','test 2','test 3']; $scope.toggleChecks = function() { $scope.allSelected = !$scope.allSelected; }; });

Angularjs复选框选择所有函数

1 个答案: