简体   繁体   English

在Select中奋斗于Angular ng-options

[英]Struggling with Angular ng-options in Select

So I'm stuck trying to use ng-options to enumerate over an array of objects and have certain properties display in a select element. 因此,我被困于尝试使用ng-options枚举对象数组并在select元素中显示某些属性。

When I query api/admin I will get JSON back that shows all users with the role of admin. 当我查询api / admin时,我将返回JSON,该JSON显示所有具有admin角色的用户。 Here's exactly how its structured. 这就是它的结构。

[
 {
 "Roles": [
          {
           "Id": 149,
           "UserId": 1807,
           "Name": "Administrator",
           "RoleGroup": "System"
           },
           {
           "Id": 148,
           "UserId": 1807,
           "Name": "Administrator",
           "RoleGroup": "System"
           },
           {
           "Id": 150,
           "UserId": 1807,
           "Name": "Lead",
           "RoleGroup": "System"
           }
         ],
 "Id": 1807,
 "UserName": "jdoe@website.com",
 "FirstName": " John",
 "LastName": "Doe",
 "Email": "jdoe@website.com"
 }
]

I want to have a <select> that displays the FirstName and LastName properties concatenated together. 我想要一个<select>来显示串联在一起的FirstNameLastName属性。

My API query looks like $scope.admin = Api.admin.query 我的API查询看起来像$scope.admin = Api.admin.query

Then in my markup it looks like: 然后在我的标记中看起来像:

<label>Admin*</label>
    <select class="form-field"
        ng-options="a.Id as a.FirstName + a.LastName for a in admin" required>
        <option value="">Select an Admin</option>
    </select>

I'm wondering what I'm missing to make this work. 我想知道我无法实现这项工作。 Any help is really appreciated! 任何帮助都非常感谢!

Add an ng-model attribute to hold the selection in the <select> 添加ng-model属性以将选择保留在<select>

  <label>Admin*</label>
  <select class="form-field" ng-model="selectedValue" ng-options="a.Id as a.FirstName + ' ' + a.LastName for a in admin" required>
     <option value="">Select an Admin</option>
  </select>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM