AngularJS ng-options with several fields

Question

I have a collection of objects with user info.

"Id": "1", "Firstname": "ABCDEF", "Lastname": "GHIJK", "Middlename": "" 

In my select options I want to display two fields - Firstname Lastname. I don't get how to do it and how to bind it to ng-model.

Answer 1

You can try this :

<select    name="users"    ng-model="selectedUser"    ng-options="user.Id as user.Firstname + ' ' + user.Lastname for user in users"> </select> 

More information in the documentation : https://docs.angularjs.org/api/ng/directive/select

Answer 2

Considering the format of your array object to be like this.

$scope.userInfo = [                     {"Id": "1", "Firstname": "ACDEF", "Lastname": "GHIJK", "Middlename": ""},                     {"Id": "2", "Firstname": "BADEF", "Lastname": "HIGJK", "Middlename": ""},                     {"Id": "3", "Firstname": "CDBEF", "Lastname": "IIHJK", "Middlename": ""},                 ] 

You can display two fields like this and and bind it to the model as shown below.

<select ng-model="userInfo" ng-options="s.Firstname +' '+ s.Lastname for s in userInfo" class="span2"> </select>