AngularJS Select Box Pre-select when array is an object

Question

I have an array of objects and when i go to populate the select with the elements, it doesn't pre-select the currently active one. If i change the select it all works as intended, but the pre-selected element is not selected on page load.

JS:

$scope.license_year_list = [
    {label:"Year of 1991", value:1991}, 
    {label:"Year of 1992", value:1992}  ];

$scope.item = {license_year: {label:"Year of 1992", value:1992}};

HTML:

<div ng-controller="MyCtrl">
    <select ng-model="item.license_year" 
            ng-options="y.label for y in license_year_list">
    </select>
</div>

Fiddle: http://jsfiddle.net/eXvH8/

with angular 1.1.5+ y.label for y in license_year_list track by y.value would have worked too. And this could be used to directly work with the values. — Yoshi
– Yoshi, Commented Sep 16, 2013 at 19:01

John Woodruff · Accepted Answer · 2013-09-16 18:35:49Z

2

Angular checks for equality based on reference of the actual object/value. To make your select box start out with the default value, do a simple assignment of the default value. Change your code like this:

HTML:

<div ng-controller="MyCtrl">
<select ng-model="item" ng-options="y.label for y in license_year_list"></select>

<br/><br/><br/>
{{item.license_year}}
</div>

JS:

function MyCtrl($scope) {
$scope.license_year_list = [{label:"Year of 1991", value:1991}, {label:"Year of 1992", value:1992}];

$scope.item = $scope.license_year_list[1];
}

answered Sep 16, 2013 at 18:35

John Woodruff

1,67616 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Michael Lynch Over a year ago

Thanks ~ The $scope.item definition is a little wrong, it still needs to be an object where the license_year is your value.

zs2020 · Accepted Answer · 2013-09-16 18:34:43Z

1

The equality of the objects are evaluated by reference, so you need use the exactly same object when you want to select it.

$scope.item = {
    license_year: $scope.license_year_list[1]
};

answered Sep 16, 2013 at 18:34

zs2020

54.7k30 gold badges157 silver badges223 bronze badges

Collectives™ on Stack Overflow

AngularJS Select Box Pre-select when array is an object

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related