綁定離子複選框的值與初始選中的值

Question

我有一些離子複選框內的一個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; 
    } 
} 

https://codepen.io/pixeloft/pen/LLboWG?editors=1000

Answer 1

很是怪異使用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"}];

Answer 2

嘗試這種方式。

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測試和它的作品！ 我真的不知道這是你在找什麼，但讓我知道！