Question

如何创建一个取消选中此过滤器中所有复选框的按钮？

请检查此[fiddle](http://jsfiddle.net/65Pyj/)

Answer 1

在代码中添加了几行在控制器中：

   $scope.ckB = function(){
        $scope.first= false;
        $scope.second=false;
        $scope.third=false;
        $scope.colourIncludes = [];
    }

html的变化：

<input type="checkbox" ng-model="first" ng-click="includeColour('Red')"/> Red</br>
    <input type="checkbox" ng-model="second" ng-click="includeColour('Orange')"/> Orange</br>
    <input type="checkbox"  ng-model="third" ng-click="includeColour('Yellow')"/> Yellow</br>
    <button ng-click="ckB()">Click</button>

这是the fiddle 我希望这会有所帮助。

Answer 2

我修改了html代码以包含ng-repeat循环。这将确保在checkAll()中您不必按名称引用每个复选框，这与Deep previous answer不同。每个元素都有一个嵌入的ng-click属性。

<!-- Start : Changed ng-repeat loop -->
<div ng-repeat="f in fruits">
    <input type="checkbox" 
            ng-click="includeColour(f.colour);"
            ng-model="f.selected">{{f.colour}}</input>
</div>
<!-- End : Changed ng-repeat loop -->

修改了控制器中的checkAll函数。

 $scope.checkAll = function () {
                               $scope.colourIncludes = [];
                               angular.forEach($scope.fruits, function (f) {
                                    f.selected = true;
                                    //to set filter dump
                                    $scope.colourIncludes.push(f.colour);
                                    });

                               };

这是JSFiddle演示：enter link description here

Angular Checkbox过滤器未选中

2 个答案: