Angular : ng-select does not show ng-selected value

Question

Trying to set the default value in select depending on the id.

I have a object location where <pre>{{location.routeId}}</pre> prints an id 819e41ef-0081-41e6-a415-2766dc16e8e4

<select ng-model="location.route">
        <option value="" disabled>Choose Route</option>
        <option ng-repeat="route in appData.Routes" 
             ng-selected="{{route.id == location.routeId}}" 
             value="{{route}}">
             {{route.id}} : {{route.name}}
        </option>
</select>

The route inappData.Routes has parameters name and id, I'm trying to match route.id with location.routeId

If I inspect element, I can seeng-selected as true for one of the options, but still its not being selected in the UI.

And here is the screenshot of UI

score -1 · Answer 1 · answered Jan 22 '17 at 21:31

-1

Take out the disabled attribute in your first option.

answered Jan 22 '17 at 21:31

Brendan Long

276
1
6

That did not help. – Deepak Bandi Jan 22 '17 at 22:06

MeTe-30 · Answer 2 · 2017-01-22T22:32:58.717

-1

Try this:

<select ng-model="location.route">
        <option value="">Choose Route</option>
        <option ng-repeat="route in appData.Routes" 
             ng-selected="route.id == location.routeId || location.route && route.id == location.route.id" 
             ng-value="route">
             {{route.id}} : {{route.name}}
        </option>
</select>

edited Jan 22 '17 at 22:32

answered Jan 22 '17 at 21:31

MeTe-30

2,512
2
21
30

Basically I need to return the complete `route`object which has `name` and `id`. Is there any way I can do that? – Deepak Bandi Jan 22 '17 at 22:04
@DeepakBandi check updates – MeTe-30 Jan 22 '17 at 22:11
It selected the first option right now. `` How do I get the right id selected? – Deepak Bandi Jan 22 '17 at 22:17
@DeepakBandi Check again plz. – MeTe-30 Jan 22 '17 at 22:33
Sorry @MeTe-30, still no luck. `` – Deepak Bandi Jan 22 '17 at 22:38
That's what it is printing in the console. It shows as selected, but still shows Choose Route as default. – Deepak Bandi Jan 22 '17 at 22:38

score -1 · Answer 3 · answered Jan 22 '17 at 21:41

-1

You don't need curly braces for ngSelected directive. So simply remove them:

ng-selected="{{route.id == location.routeId}}"

To:

ng-selected="route.id == location.routeId"

answered Jan 22 '17 at 21:41

Yaser

5,609
1
15
27

That did not help. – Deepak Bandi Jan 22 '17 at 22:06
can you create a plunker? @DeepakBandi – Yaser Jan 22 '17 at 22:09

Angular : ng-select does not show ng-selected value

3 Answers3

Linked