Struggling with Angular ng-options in Select

Question

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.

When I query api/admin I will get JSON back that shows all users with the role of 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": "[email protected]",
 "FirstName": " John",
 "LastName": "Doe",
 "Email": "[email protected]"
 }
]

I want to have a <select> that displays the FirstName and LastName properties concatenated together.

My API query looks like $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!

So you're sure that Api.admin.query is the data from the JSON above? Have you console.loged it? — Explosion Pills
– Explosion Pills, Commented Apr 23, 2014 at 17:39

klode · Accepted Answer · 2014-04-23 17:46:09Z

3

Add an ng-model attribute to hold the selection in the <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>

answered Apr 23, 2014 at 17:46

klode

11.1k6 gold badges37 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Struggling with Angular ng-options in Select

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related