How does ng-selected work?

Question

Here is a snippet. Q2 is selected as I expect.

<select name="quarter" ng-model="Quarter" >     <option value="1" >Q1</option>     <option value="2" ng-selected="Quarter=='Q1'">Q2</option>     <option value="3">Q3</option>     <option value="4">4</option> </select> 

Changing 'Q1' to 'Q2' makes nothing as selected as I expect. Now putting ng-selected="Quarter=='Q1'" DOES NOT make Q1 selected until i delete ng-selected="Quarter=='Q2"

wtf. How is this suppose to work?

Answer 1

If you put the ng-selected on the option element, your option will be selected when the ng-selected value is true. In your case, the option Q2 is selected when Quarter is equal to Q1.

If you want to select the value passed in Quarter, you must put the ng-selected on the select element :

<select name="quarter" ng-model="Quarter" ng-selected="Quarter"         ng-options="Quarter for Quarter in Quarters" >     {{Quarter}} </select> 

Take a look at the select directive documentation.

Answer 2

<select ng-model="hour">     <option ng-selected="hour == $index" ng-repeat="h in (((b=[]).length=24)&&b) track by $index" ng-bind="$index">{{h}}</option> </select> 

if you want a select for 24 hour, you can do this.