AngularJS ng-options default selected option

Question

How can you set a default option with ng-options?

I've set this in the controller (using the controller as syntax):

this.myOption = this.myOptions[0];

However, that's still returning a blank default option:

<option value="?" selected="selected"></option>

How can I set the default option to the first value in my model ("Item 1")?

Here's a JSBin demo.

@SergiuParaschiv He is using `ng-model`. – Yoshi Jun 05 '14 at 14:16 — Yoshi, Jun 05 '14 at 14:16

score 12 · Accepted Answer · answered Jun 05 '14 at 14:16

12

either change:

ng-options="value.id as value.label ...

to:

ng-options="value as value.label ...

demo: http://jsbin.com/gewebeqo/4/

or use:

this.myOption = this.myOptions[0].id;

in the controller.

demo: http://jsbin.com/gewebeqo/3/

answered Jun 05 '14 at 14:16

Yoshi

53,111
13
85
102

1

Perfect, thanks Yoshi. – Ryan Jun 05 '14 at 14:33

score 3 · Answer 2 · answered Jun 05 '14 at 14:21

3

ng-model needs the id of the option you want to select. Therefore you need to use this.myOption = this.myOptions[0].id; instead of this.myOption = this.myOptions[0].

answered Jun 05 '14 at 14:21

Daniel

3,508
2
34
42

AngularJS ng-options default selected option

2 Answers2