角度选择空值

时间:2014-07-17 13:35:04

标签: angularjs

我有一个管理用户角色的应用程序。我在数组$scope.users中有很多用户。用户对象的结构如下所示:

{
    name: "Larry",
    role: {
        id: 2,
        name: "Work"
        class: "role-work"
    },
    mustHaveRole: true
}

我在数组$scope.roles中也有一堆角色。每个角色元素的结构与每个用户role字段相同。

我需要创建一个<select>元素,其中包含$scope.roles中的每个角色。每个<option>元素都需要在其class字段中指定类。必须首先选择与用户的id匹配role.id的角色。 <select>元素必须从绝对选择的<option>元素继承它的类。对于mustHaveRole设置为false的用户,还必须有一个空元素,将role字段设置为null

如何实现这一目标?我觉得ng-options不够灵活,但当我使用<option>创建所有ng-repeat元素时,Angular有时会创建一个额外的空<option>元素,它不应该存在 -

1 个答案:

答案 0 :(得分:0)

ng-model分配用户角色ID

<div ng-controller="MyCntrl">
  <select ng-model="user.role.id" ng-options="v for v in roles">
  </select>
</div>

function Ctrl($scope) {
  $scope.roles= {   "type": "select", 
    "values": [ "Role 1", "Role 2", "Role 3", "Role 4"] 
  };
}

选中此plnkr