Angular JS ng model not starting properly for the first time

Question

I am using Angular JS ng-model to track the selected value of a select tag.

here's an example http://jsfiddle.net/8853oxb1/3/

function ControllerA($scope) { $scope.optionsArray = [1,2,3,4,5]; $scope.optionsObject = {"India" : "IN" , "Singapore" : "SG", "Malaysia" : "MY", "Indonesia" : "INDY"}; } 

If I go to the drop-down list using the tab key and try to press "I" twice to select the second option, starting with I, the value of the dropdown value will be updated, as expected, bu ng-model just takes the value of the first option with "I" . Error in Angular js or am I doing something wrong here?

Answer 1

Look at jsfiddle

The main difference from your code is the way to create a dropdown list.

Instead of filing it with a single object

 $scope.optionsObject = {"India" : "IN" , "Singapore" : "SG", "Malaysia" : "MY", "Indonesia" : "INDY"}; 

you need to change your data to something else, like an array of arrays, for example:

 $scope.optionsObject = [ { name: "India", code: "IN" }, { name: "Singapore", code: "SG" }, { name: "Malaysia", code: "MY" }, { name: "Indonesia", code: "INDY" } ];