Angularjs select - set initial selection based on model

Question

I have an array of job objects that gets pulled from the server, and an array of people objects also pulled from the server. I want the persons job to be represented by a select element, populated from the jobs array. I have populated the select using ng-options, and when changing the selection, the person model's job object is updated. The only issue I have is that to start with the select shows an empty value. I can't work out how to have it show the person objects current job?

 <select  
   ng-model='person.job' 
   ng-options='job.title for job in jobs'>
 </select>

the person object looks like this

{
  "id": "1",
  "firstName": "Marianne",
  "lastName": "Jenkins",
  "middleNames": null,
  "ext": "4680",
  "phoneCell": "1-174-668-3846",
  "phoneHome": "+10(2)5744088105",
  "takerNumber": "180",
  "hidden": "0",
  "created_at": "2014-01-09 12:55:12",
  "updated_at": "2014-01-09 12:55:12",
  "job": {
    "id": "25",
    "title": "Office Manager",
    "created_at": "2014-01-09 12:55:11",
    "updated_at": "2014-01-09 19:25:03"
  },
  "office": {
    "id": "4",
    "name": "Salt Lake City",
    "prefix": "702",
    "order": "2",
    "takerNumber": "103",
    "address_id": "1"
  }
}

and the jobs array looks like this

[
  {
    "id": "1",
    "title": "Field Service Tech",
    "created_at": "2014-01-09 12:55:11",
    "updated_at": "2014-01-09 19:25:03"
  },
  {
    "id": "2",
    "title": "Inside Sales Manager",
    "created_at": "2014-01-09 12:55:11",
    "updated_at": "2014-01-09 19:25:03"
  },
  {
    "id": "3",
    "title": "Office Assistant",
    "created_at": "2014-01-09 12:55:11",
    "updated_at": "2014-01-09 19:25:03"
  },
  ...
  {
    "id": "25",
    "title": "Office Manager",
    "created_at": "2014-01-09 12:55:11",
    "updated_at": "2014-01-09 19:25:03"
  }
  ...
]

Hope I've provided enough information and sorry if my description is a bit unclear, I struggled a bit to accurately describe my problem here.

Thanks in advance!

Note: The person shown here was generated and is not real.

michael · Accepted Answer · 2014-01-09 20:42:06Z

1

please try this:

<select  
   ng-model='person.job' 
   ng-options='job.title for job in jobs track by job.id'>
</select>

e.g. extends the expression with: track by job.id

answered Jan 9, 2014 at 20:42

michael

16.4k8 gold badges57 silver badges60 bronze badges

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

Collectives™ on Stack Overflow

Angularjs select - set initial selection based on model

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related