如何在angularjs中的提交功能上获取ng-repeat复选框值

Question

我有一个包含 10 个复选框的表单。默认情况下，角度 js 在单个复选框上触发。我只想在提交操作中获取所有选中的复选框值。这是我的代码...

<form name="thisform" novalidate data-ng-submit="booking()">
    <div ng-repeat="item in items" class="standard" flex="50">
        <label>
            <input type="checkbox"  ng-model="typeValues[item._id]" value="{{item._id}}"/>
            {{ item.Service_Categories}}
        </label>
    </div>
    <input type="submit" name="submit" value="submit"/>
</form>

---

$scope.check= function() { 
    //console.log("a");
    $http.get('XYZ.com').success(function(data, status,response) { 
    $scope.items=data;
});

$scope.booking=function(){
    $scope.typeValues = [];
    console.log($scope.typeValues);
}

我得到的是空数组。

有人能告诉我如何仅在提交事件时获取所有选中的复选框值吗？

Answer 1

<div ng-repeat="item in items">
    <input type="checkbox" ng-model="item.SELECTED"  ng-true-value="Y" ng-false-value="N"/>
</div>
<input type="submit" name="submit" value="submit" ng-click="check(items)"/>

$scope.check= function(data) { 
    var arr = [];
    for(var i in data){
       if(data[i].SELECTED=='Y'){
           arr.push(data[i].id);
       }
    }
    console.log(arr);
    // Do more stuffs here
}

Answer 2

我能否建议阅读我昨天发布的类似 StackOverflow 问题的答案..

AngularJS with checkboxes

这显示了几个复选框，然后将它们绑定到一个数组，所以我们总是知道当前选中了哪些框。

是的，如果您愿意，您可以在按下提交按钮之前忽略此绑定变量的内容。

Answer 3

根据您的代码，所有复选框值都将在 typeValues 数组中可用。你可以在你的提交函数中使用这样的东西：

$scope.typeValues

如果你想访问第三个复选框的值，那么你需要这样做：

var third = $scope.typeValues[2];

Answer 4

将您的ng-model 声明为控制器中的数组，例如

$scope.typeValues = [];

请在您的模板中使用

ng-model="typeValues[item._id]"

在你的控制器中，你会得到这个model array values 的0 和1。你可以在那里迭代。