我用对象加载 ng-options，但我希望匹配的 ng-model 作为单个值

Question

我使用的数组结构如下：

[
{"name": "Afghanistan", "code": "AF"},
{"name": "Åland Islands", "code": "AX"},
{"name": "Albania", "code": "AL"},
{"name": "Algeria", "code": "DZ"},...

使用 ng-options 加载 select：

  <select class="form-control" id="country" ng-model="val" ng-options="country.name for country in countryList">
                    </select>

确实 select 按名称显示国家/地区列表。我希望列表 select 通过国家代码而不是对象 {name ... code..} 选项，因为它现在可以工作。我怎么能那样做？谢谢

Answer 1

为 ng-options、

检查 DOC

它说，

对于数组数据源：

label for value in array

select as label for value in array

label group by group for value in array

label disable when disable for value in array

label group by group for value in array track by trackexpr

label disable when disable for value in array track by trackexpr

label for value in array | orderBy:orderexpr track by trackexpr (for including a filter with track by)

所以你需要修改你的代码如下，

 <select class="form-control" id="country" ng-model="val" ng-options="country.code as country.name for country in countryList">

此处ng-options="country.code as country.name for country in countryList"

countryList - is the data source.

country - is the single item in the countryList.

country.name - is the name property of the country this is the label in option.

country.code - is the selected value in the select box.

这里是 Demo Plunker

Answer 2

您可以select通过以下代码，

<select id="country" ng-model="val" ng-options="country.code as country.name for country in countryList"></select>

如果您想要整个 selected 对象，您可能出于其他原因想要处理它

<select id="country" ng-model="mySelectedCountry" ng-options="country as country.name for country in countryList">"></select>

我用对象加载 ng-options，但我希望匹配的 ng-model 作为单个值

I load the ng-options with object, but I would like the matching ng-model as a single value

angularjs

angularjs-ng-options