AngularJS Select element set the selected index

Question

So i'm using angular and this is my select html:

<select id="date" ng-model="selectedDay" ng-change="setDate()" >
    <option>another option</option>
    <option>an option</option>
</select>

this is in my controller:

$scope.selectedDay;
document.getElementById("date").selectedIndex = "0";

The result: Three options: one blank (which is default selected) and then the two options I made in html

What the hell? why isn't the default when i open the view "another option"

Go with `ngOptions` when you use `select` in AngularJS https://docs.angularjs.org/api/ng/directive/select — developer10, Oct 06 '14 at 13:29

score 6 · Accepted Answer · edited Mar 17 '15 at 23:52

6

Firstly, always check the official documentation. AngularJs is well documented.

Secondly, do not use document.getElementById ("date") selectedIndex = "0" - that's javascript. Avoid using pure Javascript when an Angular function is available.

Documentation:

https://docs.angularjs.org/api/ng/directive/select

https://docs.angularjs.org/api/ng/directive/ngSelected

edited Mar 17 '15 at 23:52

simonmorley

2,810
4
30
61

answered Oct 06 '14 at 13:21

Nano

126
7

2

Thank you! ng-selected="selectedOption" in controller: selectedOption = "another option" did the trick! – ErikBrandsma Oct 06 '14 at 13:34

AngularJS Select element set the selected index

1 Answers1

Linked