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": "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.

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!

Answer 1

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>