绑定离子复选框的值与初始选中的值
问题描述:
我有一些离子复选框内的一个ng-重复最初检查一些复选框。我似乎无法设法在表单提交上绑定这些初始值。以下是我与迄今为止的工作:绑定离子复选框的值与初始选中的值
HTML:
<ion-list>
<label ng-repeat="item in items">
<ion-checkbox ng-model="item.checked" ng-checked="itemCheck(item)">
{{item.name}}
</ion-checkbox>
</label>
</ion-list>
JS:
$scope.items = [{name:"name1"},{name:"name2"},{name:"name3"},{name:"name4"}];
$scope.itemCheck = function(data){
$scope.checkedItems = [{name:"name2"},{name:"name3"}];
$scope.checkedResult = $scope.checkedItems.filter(function(item) {
return item.name == data.name;
});
if ($scope.checkedResult.length > 0){
return true;
} else {
return false;
}
}
答
很是怪异使用ng-model
和ng-checked
在一起。我只使用ng-model
,我没有问题。 只需保持简单的模型:而不是$scope.checkedItems = [{name:"name2"},{name:"name3"}];
为什么不只是设置每个项目的检查属性?
初始化您的项目是这样的: $scope.items = [{name:"name1"},{name:"name2", checked: true},{name:"name3", checked: true},{name:"name4"}];
答
尝试这种方式。
HTML
<ion-list>
<label ng-repeat="item in items">
<ion-checkbox ng-model="item.checked" ng-checked="itemCheck(item,$index)">
{{item.name}}
</ion-checkbox>
</label>
</ion-list>
JS
$scope.items = [{name:"name1"},{name:"name2"},{name:"name3"},{name:"name4"}];
$scope.itemCheck = function(data,index){
$scope.checkedItems = [{name:"name2"},{name:"name3"}];
$scope.checkedResult = $scope.checkedItems.filter(function(item) {
return item.name == data.name;
});
if ($scope.checkedResult.length > 0){
$scope.items[index].checked=true;
return true;
} else {
$scope.items[index].checked=false;
return false;
}
}
我codepen测试和它的作品! 我真的不知道这是你在找什么,但让我知道!
https://codepen.io/jhonnyvennom/pen/ZyBgKv?editors=0010 –