AngularJS - Set selected value from model

Question

Angular version - 1.2.28 (Legacy, pending upgrade)

I'm trying to set the selected value for my select element via the model value.

In my Controller I have the below line;

$scope.customer.country = 'GB';

And in my view I have the below select element;

<select
    ng-model="customer.country"
    ng-options="country as country.name for country in countries track by country.alpha2">
</select>

I was expecting, that should I have an object in countries with the alpha2 value of 'GB', it would be selected by default on render.

However the actual behaviour is the empty option is selected by default.

How do I set the default selected value via the model (ng-model) value?

I thought you have rebind the dropdown after initialize the object? — Ramesh Rajendran
– Ramesh Rajendran, Commented May 4, 2017 at 10:35

mastermind · Accepted Answer · 2017-05-04 10:42:35Z

2

It seems initialization is wrong

$scope.customer.country = 'GB';

You have to initialize with the same object of array which is binded (countries)

should look like

$scope.customer.country = $scope.countries[0];

answered May 4, 2017 at 10:28

mastermind

1,0551 gold badge8 silver badges15 bronze badges

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

1 Answer 1