Angular获取选中的复选框

我有一个使用角度动态填充复选框的列表。Angular获取选中的复选框

<div ng-repeat="X in XList"> 
    <label>{{X.Header}}</label> 
    <input type="checkbox" name="X" value="{{X.Item.Id}}" /> 
    <p>{{X.Header}}</p> 
</div>

我想要一个方法来检索所有选中的复选框的列表。通常我会用

$('input[name=checkboxlist]:checked').each(function() 
{ 
}

但是，这并不具有角接受....那么，有没有一种合适的方法来做到这一点？

来源

2013-08-07 Sana Joseph

这里是实现plunker

<input type="checkbox" ng-model="selected[record.Id]"> {{record.Id}} 

$scope.ShowSelected = function() { 
    console.log($scope.selected); 
    alert(JSON.stringify($scope.selected)); 
};

来源

2013-08-07 10:18:48

这很棒，但是当我检查其中一个复选框时，会出现以下消息：错误：无法将undefined转换为对象 –

我没有得到您想说的内容，您能否详细说明在哪种情况下出现错误？我在选择复选框时看不到任何错误。 –

是的，在你的代码中它很好用，但是当我在代码中添加“ng-model = selected []”时，当我尝试选择其中一个复选框时，我收到该错误。 –

您可以使用ng-model指令将属性直接绑定到元素。

例如

<input type="checkbox" ng-model="X.Item.Id" />

这将更新您的模型。

由此您将能够检查您的模型中的值并查看哪些被检查。

例如

angular.forEach($scope.yourModelItems, function(item){ 
    // item.value ? 0 : 1; 
});

查看ngModel的文档。 angularjs.org主页上的ToDo列表示例也说明了这一点。

p.s.在附注中，您还可以在之前添加data-以使您的角度指令html5变得友好。例如data-ng-model="X.Item.Id"

来源

2013-08-07 10:16:55

非常感谢按钮，会是可能的，如果你提到检查方法？ –

你需要发布你的模型的代码，所以我可以看到值。 –

然后采取行动

<button ng-click="get_all_cheked()">Get checked</button>

，然后在控制器

$scope.selected = {}; 
$scope.get_all_cheked=function() { 
console.log("click"); 
console.log($scope.selected); 
}

来源

2017-10-31 08:03:52 Leo

Angular获取选中的复选框

回答

相关问题