Unable to set selected value in angularjs dropdown

Question

I am using html dropdown and binded the values from angularjs funtion, the values like below

function getStates() {
return [
    {
        "name": "Alabama",
        "abbreviation": "AL"
    },
    {
        "name": "Alaska",
        "abbreviation": "AK"
    }];
}

and my dropdown is

<select class="form-control" 
        ng-model="user.state" name="state"
        ng-options="item.name for item in  states track by item.abbreviation">
   <option value="">-- choose State --</option>
</select>

In my scope variable user.state i got an abbreviation value which is preloaded by some function, based on that abbreviation value the selected value of dropdown should be shown in the html page.

valuable comments are welcome...

Answer 1

You need the correct ngOptions syntax value as text for item in collection

ng-options="item.abbreviation as item.name for item in states"