Выбор привязки с помощью ng-options с использованием массива меток и значений

Я всю жизнь не могу понять, как установить как лабаль, так и значение выбора, используя массив

У меня есть множество стран

$scope.countries =  [
    {abbr:"US", name:"United States"},
    {abbr:"CA", name:"Canada"},......
]

Я хочу, чтобы выбор генерировался как таковой

<select>
  <option value="US">United States</option>
  <option value="CA">Canada</option>
</select>

Однако самое близкое, чего я смог достичь, это

<select>
  <option value="1">United States</option>
  <option value="2">Canada</option>
</select>

Я добился этого, используя

<select class="form-control" ng-options="country.Name for country in countries" ng-model="selectedCountry">

Как назначить метку И значение с помощью ng-options?


angularjs ng-options
person mrb398    schedule 27.02.2015    source источник
comment
docs.angularjs.org/api/ng/directive/ngOptions. Документы angular расскажут вам, как это сделать.   -  person ribsies    schedule 27.02.2015
comment
На это уже ответил stackoverflow.com/questions/12139152/   -  person gerl    schedule 28.02.2015

Ответы (2)


arrow_upward
1
arrow_downward

Без тестирования я думаю, что это просто

ng-options="country.abbr as country.name for country in countries"
person Dylan    schedule 27.02.2015
comment
Я так и думал, но вместо сокращенного значения выдает числовое значение. - person mrb398; 27.02.2015
comment
Ничего себе, это немного грубо - jsfiddle.net/devitate/uaxv70kc - это работает. - person Dylan; 28.02.2015
comment
Извините, вы были правы. Видимо, я тоже был прав все это время. Я смотрел на сгенерированный HTML, а не на то, что на самом деле хранилось в модели. Спасибо - person mrb398; 28.02.2015

arrow_upward
0
arrow_downward

Для точной структуры вам нужно сделать ng-repeat через ваш <option><option> ng-options никогда не будет устанавливать значение, которое вы хотите, оно всегда будет устанавливать 0,1,2,3 и т. д.

HTML

<select ng-model="selectedCountry">
    <option ng-repeat="country in countries" value="{{country.abbr}}" ng-bind="country.name"></option>
</select>

JSFiddle

Надеюсь, это поможет вам, спасибо.

person Pankaj Parkar    schedule 27.02.2015
comment
@user1691808 user1691808, если это поможет, то хотя бы проголосуйте .. Спасибо. - person Pankaj Parkar; 28.02.2015