从表单中的复选框中获取选定的数据答案

【问题标题】：Get selected data from checkbox in a form从表单中的复选框中获取选定的数据
【发布时间】：2014-04-05 18:52:21
【问题描述】：

我有一个带有多个复选框的表单，我使用 ng-repeat 显示来自 JSON 文件的复选框数据。现在，当我提交表单时，我想从复选框中获取选中的数据。提交表单后如何访问检查的数据？我做了一些研究，现在我可以使用ng-model="s.checked" 在页面本身上显示检查的数据，但是我如何在控制器端访问检查的数据。

详情请见Plunk

【问题讨论】：

All checkboxes get checked when one is checked (should be just the one checked) - inputs generated with angular js的可能重复

标签： javascript forms angularjs checkbox

【解决方案1】：

你有一个对象数组：

$scope.list = [
{"ID":5000,"Name":"ABC",checked:true},
{"ID":5001,"Name":"DEF",checked:false},
{"ID":5002,"Name":"XYZ",checked:false}];

因此您可以像这样访问已检查属性的值：

$scope.submit = function() {
    var val1 = $scope.list[0].checked;
    var val2 = $scope.list[1].checked;
    var val3 = $scope.list[2].checked;
}

或者用forEach声明：

$scope.submit = function() {
    angular.forEach($scope.list, function (listValue) {
       var val = listValue.checked;
    });
}

【讨论】：

【解决方案2】：

提交时$scope.List的结构并没有改变，它仍然是一个对象数组。你可以做类似的事情

$scope.submit = function() {
    var checkedItems = $scope.List.filter(function(item){
        return item.checked;
    });
    console.log(checkedItems);
};

List 项的值已更改。

（另外，使用ngSubmit 通常是个好主意）

【讨论】：

也许唯一要补充的是，Array.prototype.filter 在 IE8（和 IE7）上是 not supported。