带角的复选框和取消复选框
带角的复选框和取消复选框
提问于 2017-02-17 14:58:31
在我的表单中，所有这些列都有一个带有复选框的表。我有3个<tr>，每个<tr>都有它的ng-repeate调用webservice来显示克隆(Json数据)。当我单击复选框时，我生成一个js数组，该数组使用以下代码记录id：
checkoptions (array, model) {
angular.forEach(array, (value, key) => {
if (array[key].checked) {
model.push(array[key].id)
}
})在HTML中：
<tr ng-repeat="developer in $ctrl.developers">
<td>{{developer.label}}</td>
<td>
<input type="checkbox" id="{{developer.id}}"
ng-change="$ctrl.checkoptions($ctrl.developers,$ctrl.employees.developers)"
ng-model="developer.checked">
<label for="{{developer.id}}"></label>
</td>
它可以工作，但问题是，当我取消选中复选框时，它不会从js数组中删除。
回答 2
Stack Overflow用户
回答已采纳
发布于 2017-02-17 16:37:44
我包括了一个从数组中删除的其他部分：http://jsfiddle.net/x9m1nqvp/1/
$scope.checkoptions = function (array, model) {
angular.forEach(array, (value, key) => {
if (array[key].checked) {
var index = model.indexOf(array[key].id);
if(index == -1)
model.push(array[key].id)
}
else {
var index = model.indexOf(array[key].id);
if(index >=0)
model.splice(index, 1);
}
})Stack Overflow用户
发布于 2017-02-17 17:53:46
虽然Everton的答案完成了任务，但是每次单个复选框更改状态时，检查数组中的每一项都是有点多余的。您不需要对数组中的每个项目进行更新。
下面是一个示例，其中只从employees.developers数组中添加或删除实际切换的复选框(注意:不需要冗余的angular.forEach)：
$scope.checkoption = function (developer){
if (developer.checked) {
var index = $scope.employees.developers.indexOf(developer.id);
if(index == -1)
$scope.employees.developers.push(developer.id)
} else {
var index = $scope.employees.developers.indexOf(developer.id);
if(index >=0)
$scope.employees.developers.splice(index, 1);
}
}以及如何在html中使用：
<tr ng-repeat="developer in developers">
<td>{{developer.label}}</td>
<td>
<input type="checkbox" id="{{developer.id}}"
ng-change="checkoption(developer)"
ng-model="developer.checked">
<label for="{{developer.id}}"></label>
</td>
</tr>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/42300988
复制相关文章
相似问题
腾讯云开发者
