最初のチェック値でイオンチェックボックスの値をバインドする

Question

最初にいくつかのチェックボックスがチェックされているng-repeat内にいくつかのイオンチェックボックスがあります。フォームの送信時にこれらの初期値をバインドすることはできません。ここで私はこれまでのところで働いているものです：

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でテストし、それが動作します！ これはあなたが探しているが、私に教えてもらえますか？