Setting default value in select drop-down using Angularjs

Solution 1:

Problem 1:

The generated HTML you're getting is normal. Apparently it's a feature of Angular to be able to use any kind of object as value for a select. Angular does the mapping between the HTML option-value and the value in the ng-model. Also see Umur's comment in this question: How do I set the value property in AngularJS' ng-options?

Problem 2:

Make sure you're using the following ng-options:

<select ng-model="object.item" ng-options="item.id as item.name for item in list" />

And put this in your controller to select a default value:

object.item = 4

Solution 2:

When you use ng-options to populate a select list, it uses the entire object as the selected value, not just the single value you see in the select list. So in your case, you'd need to set

$scope.object.setDefault = {
    id:600,
    name:"def"
};

or

$scope.object.setDefault = $scope.selectItems[1];

I also recommend just outputting the value of $scope.object.setDefault in your template to see what I'm talking about getting selected.

<pre>{{object.setDefault}}</pre>