Javascript 以角度匹配2个数组，并将匹配项作为复选框

我想能够管理的角度网页中的用户角色。我有一个对象，它列出了系统中所有当前角色

然后基于a用户，我可以得到他当前角色中的角色

我可以将所有角色列为复选框，然后我希望根据角色选择用户的复选框。例如，如果他是记者和公众，我希望选中这些复选框

  <label ng-repeat="m in UserDetails">
            <input type="checkbox" ng-model="UserDetails[m]" /> {{m}}
  </label>

{{m}}

---

在

UserDetails

中，我列出了所有角色。我希望选中复选框

听起来你想要这个指令。可能是这样的：

  <label ng-repeat="m in UserDetails">
            <input type="checkbox" ng-model="UserDetails[m]" /> {{m}}
  </label>

<input type="checkbox" 
       ng-model="UserDetails[m]" 
       ng-checked="currentUsersRoles.indexOf(m) >= 0" /> {{ m }}

然后，要创建复选框列表，请执行以下操作：

<label ng-repeat="(role, value) in currentUser.rolesObj">
  <input type="checkbox" ng-model="value" /> {{ role }}
</label>

---

这里有一个例子，以防万一。请注意，JSFIDLE使用的是Angular 1.2.1，如果您使用的是较新的版本，则需要进行一些调整。

这很好！现在如何将新值传递回用户角色列表？例如，如果我选择

admin

如何将此值添加到

currentUsersRoles

中，您可能需要稍微更改数据的结构。您可以为每个用户提供一个角色对象，其中角色名称表示键，布尔值表示值，而不是为每个用户提供一个角色数组。然后，您可以在键上重复生成复选框列表，然后将值设置为复选框的ngModel。我将把这个添加到我的答案中。您可能需要稍微更改数据的结构。您可以为每个用户提供一个角色对象，其中角色名称表示键，布尔值表示值，而不是为每个用户提供一个角色数组。然后，您可以在键上重复生成复选框列表，然后将值设置为复选框的ngModel。我已经更新了我的答案，也包含了这些信息。

$scope.rolesObjFromArray = function (rolesArr) {
  var rolesObj = {
    "Public": false,
    "Reporter": false,
    "Partner": false,
    "LCSP": false,
    "Admin": false,
    "StrategicPursuit": false,
    "PA": false
  };

  rolesArr.forEach(function (role) {
    rolesObj[role] = true;
  });

  return rolesObj;
}

$scope.currentUser.rolesObj = rolesObjFromArray(currentUserRoles);