ng-repeatにチェックボックスを再割り当てする方法

Question

私を助けてください。モデルが定義されたチェックボックスがあります。私はチェックボックスを表示しており、チェックボックスが選択されているかどうかを設定するためにモデルを使用しています。以下は、ng-modelを設定するためのコードです。

LoadValues(obj) { 

    vm.index = false; 
    vm.create = false; 
    vm.edit = false; 
    vm.delete = false; 
    vm.other = false; 

    var pList = obj.Functions; 
    var currentModule = obj.Name; 

    for (var i = 0; i < pList.length; i++) { 

    var currentItem = pList[i]; 
    console.log(currentItem) 

    if (currentItem.search("Index") > 0) { 
     vm.index = true; 
     console.log(vm.index); 
    } else if (currentItem.search("Create") > 0) { 
     vm.create = true; 
    } else if (currentItem.search("Edit") > 0) { 
     vm.edit = true; 
    } else if (currentItem.search("Delete") > 0) { 
     vm.delete = true; 
    } else if (currentItem.search("Other") > 0) { 
     vm.other = true; 
    } 
    } 
} 

以下はチェックボックスです。

<tbody> 
    <tr ng-repeat="item in list"> 
    <td> 
     {{item.Name}} 
    </td> 
    <td> 
     <input id="Index" type="checkbox" ng-model="vm.index" ng-click="EditRole(Right,item.Module,'Index')"> 
    </td> 
    <td> 
     <input id="Create" type="checkbox" ng-model="vm.create" ng-click="EditRole(item.Role,'Create')"> 
    </td> 
    <td> 
     <input id="Edit" type="checkbox" ng-model="vm.edit" ng-click="EditRole(item.Role,item.Module,'Edit')"> 
    </td> 
    <td> 
     <input id="Delete" type="checkbox" ng-model="vm.delete" ng-click="EditRole(item.Role,item.Module,'Delete')"> 
    </td> 
    <td> 
     <input id="Other" type="checkbox" ng-model="vm.other" ng-click="EditRole(item.Role,item.Module,'Other')"> 
    </td> 
    </tr> 
</tbody> 

問題は、リスト内のすべての項目に同じng-modelを割り当てていることです。私は何も助けてくれない解決策を見つけようとしました。あなたの助けは非常に高く評価されるでしょう。

私はjsonファイルから自分のデータを読んでいます。以下にいくつかの例のデータをされていますため、ループ内のコントローラ内で

ng-model="item.index" 

そして：

[ 
{"Role":"Staff","Admins":[{"Name":"Username","userRights":["UserEdit","UserCreate"] 
    }] 

Answer 1

チェックボックスでng-modelを使用する最も簡単な方法は、abjectを渡すことです。以下のコードは、項目の配列をチェックボックスのオブジェクトに変換します。

利用可能なすべてのオプションを含む$scope.userRightsという変数を作成しました。 HTMLの私たちのループでは

各フィールドはuserRightsのすべてものの、その名前と、ループを表示するのに。

送信ボタンは、オブジェクトを受信した配列形式に変換します。

HTML

<div ng:controller="MainCtrl"> 
    <button ng-click="submit()">Submit</button> 

    <table> 
    <tr ng-repeat="field in fields"> 
     <td ng-bind="field.Name"></td> 

     <td ng-repeat="right in userRights"> 
     <label> 
      <input type="checkbox" ng-model="field.userRights[right]" /> {{right}} 
     </label> 
     </td> 
    </tr> 
    </table> 

    <pre ng-bind="fields | json"></pre> 
</div> 

はJavaScript

app.controller('MainCtrl', function($scope) { 
    $scope.userRights = ["UserEdit","UserCreate","UserSomethingElse"]; 

    $scope.fields = [ 
    {"Name":"Username","userRights":["UserEdit","UserCreate"]}, 
    {"Name":"Password","userRights":["UserEdit"]} 
    ]; 

    // Convert array to object 
    $scope.fields.forEach(function(field) { 
    var res = {}; 
    field.userRights.forEach(function(right) { 
    res[right] = true; 
    }); 
    field.userRights = res; 
    }); 

    function objectValues(obj) { 
    var res = []; 
    var keys = Object.keys(obj); 
    for (var i=0; i<keys.length; i++) { 
     if (obj[keys[i]]) res.push(keys[i]); 
    } 
    return res; 
    } 

    // Convert object to array 
    $scope.submit = function() { 
    $scope.fields.forEach(function(field) { 
     field.userRights = objectValues(field.userRights); 
    }); 
    }; 
}); 

Demo

Answer 2

はあなたのngのモデルはそうのようにする必要があり

current_item.index = true; 

はそれが役に立てば幸い=）