以角度js获取所有选中的复选框

时间:2015-08-06 10:38:46

标签: javascript jquery arrays angularjs scope

我是角度js的新手。 我的模板:

<div class="inputField">
    <h1>Categories</h1>
    <div>
        <label><input type="checkbox" id="all" ng-model="all" ng-change="checkAll();" ng-true-value="1">All Cuisines</label>
        <label ng-repeat="category in categories">
            <input type="checkbox" ng-checked="all"  ng-model="filter.cats[category.id]" ng-change="SingleCheck(category.id);" value="category.id">{{category.category_name}}
        </label>
    </div>

</div>

<div class="clear"></div>
<a href="javascript:void(0)" class="fRight greenBtn" ng-click="ApplyFilter();">Apply</a>

控制器:

App.controller("FilterRestCtrl",function($scope,basic,stateList){
   // stateList.autoFill();
    var home_data = {
        requestFor: "cate_states"
    }
    $scope.filter = {
        cats: []
    };
    basic.hitAPI(basic.defaultVal.sitePath + "getCategoryAndStates", {reqObject: JSON.stringify(home_data)}).success(function (response) {
        if (response.type == "success") {
            $scope.imagePath = basic.defaultVal.imagePath;
            $scope.home_data = response;
            $scope.categories= response.all_categories;
        }else if (response.type == "error") {
            basic.messages.showErrorMessage(response.message);
        }else {
            basic.messages.showErrorMessage("Oops... Something went wrong .. please try again");
        }
    });
    $scope.checkAll = function() {
        if($scope.all == 1){
            $scope.filter.cats = $scope.categories.map(function(item){ return item.id;});
        }else{
            $scope.filter.cats = [];
        }
    };
    $scope.ApplyFilter = function() {
        console.log($scope.filter.cats);
    };
    $scope.SingleCheck = function($cat){
        $scope.filter.cats.push($cat);
    }

});

首先。我想检查所有复选框都点击第一个复选框。检查完成后,当我点击Apply然后返回一个空数组时,它工作得很好。但我想检查价值观。 如果我点击checkboes,然后点击应用然后它工作正常。那为什么它不适用于所有选中的复选框。我喜欢这样的结果:

["48", "34", "50", "33", "35", "47", "36", "45", "49", "46", "44", "43", "42", "31", "37", "41", "38"]

1 个答案:

答案 0 :(得分:0)

更改您的checkAll函数,如下所示。您以某种方式得到一个空数组,因为if($scope.all == 1)这不是对true的评估。

$scope.checkAll = function() {
    if($scope.all){
                  $scope.filter.cats = $scope.categories.map(function(item){ return item.id;});
    }else{
          $scope.filter.cats = [];
    }
  console.log( $scope.filter.cats) //verify this log if its populated correctly
};

如果这不起作用,请检查$scope.all函数

checkAll的值