set selected value in ng-option based on ng-repeat

Question

<li class="list-group-item" ng-repeat="entity in displayedProjectRoles">
    <div>
        <strong>Role: </strong> 
        <select
            ng-model="project.role" 
            ng-options="option as option.name for option in project_role"
            ng-required="true"
            id="project_role"
            class="form-control">
        </select>
    </div>
</li>

How can I set the value of model project.role based on the value on entity.role in the ng-repeat? I tried ng-selected or even using entity.role in the ng-model but it's not working properly.

this is the data in displayed Project Roles

[
  {
    "empid": 2,
    "role": "employee"
  },
  {
    "empid": 1,
    "role": "pm"
  }
]

and in the project_role

[
  {
    "id": 1,
    "name": "employee"
  },
  {
    "id": 2,
    "name": "pm"
  }
]

So basically the value of role in displayedProjectRoles matches with the name in project_role

Try setting project.role = { "id": 1, "name": "employee" } as a test and see if it binds — Lee.Winter, Nov 27 '15 at 03:52
What is project_role? please try to include everything. Consider building a plunker, it would be great for understanding and giving you a working solution. — Ignacio Villaverde, Nov 27 '15 at 04:27

score 0 · Accepted Answer · edited May 23 '17 at 12:07

0

This is a good example of angular select.

Essentially the ng-model for the select has to match the ng-option value to bind. In your example project.role would have to be exactly equal to option from your ng-options. Note this is type specific so had it been

option.id as option.name for option in project_role

and option.id == 1 then project.role == '1' will not bind

edited May 23 '17 at 12:07

Community

1
1

answered Nov 27 '15 at 03:17

Lee.Winter

700
9
16

set selected value in ng-option based on ng-repeat

1 Answers1