angular 复选框checkBox多选的应用

应用场景是这样的,后台返回的数据在页面上复选框的形式repeat出来

可能会有两种需求:

第一:后台返回的只有项,而没有默认选中状态(全是待选状态)

这种情况相对简单只要repeat出相应选项

第二:后台返回的不仅有项,还有选中状态

这个时候需要后台返回一个带状态值的参数,然后绑定在modal上,设置ng-true-value=“”中 默认选中的值,reepeat出来的时候就可以带选中状态了。

接下来说下重点:怎么把选中的打钩项一并传给后台,

我这里说下我个人的做法

主要是在每个 checkBox 上添加 ng-click 并且将key值传入

<input ng-checked="checkFirst(a.appid)" ng-click="appSelect(a.appid)" type="checkbox"/>{{a.appname}

之后在点选的时候进行判断,主要代码

   $scope.arrApp = [];   // 如果需要选中默认值或者带入默认选项需要循环出所以key值添加到数组中
$scope.appSelect = function(id){ var index = $scope.arrApp.indexOf(id); if( index < 0 ){ $scope.arrApp.push(id); }else{ $scope.arrApp.splice(index,1); } }

OK,这样只要把相应的数组传入后端就可以了。

原文地址:https://www.cnblogs.com/cench/p/5412533.html