我用对象加载ng选项，但我希望匹配的ng模型作为单个值

Question

我使用的数组结构如下：

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

加载带ng选项的选择：

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

实际上，select显示了按名称列出的国家列表。我希望列表按国家代码而不是按对象｛name…code..｝选择一个选项，因为它现在可以工作。我怎么能那样做？感谢

Answer 1

检查DOC的ng-options、

上面写着，

对于阵列数据源：

数组中值的标签

选择作为阵列中值的标签

按组标记数组中的值

阵列中的值禁用时标签禁用

按组标记数组中的值按trackexpr

trackexpr 对阵列磁道中的值禁用时标签禁用

数组中值的标签|orderBy：orderexpr track-by-trackexpr（用于包含带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-是数据源。

country-是countryList中的单个项目。

country.name-是country的名称属性，这是选项中的标签。

country.code-是在select框中选择的值。

这是演示Plunker

Answer 2

您可以通过以下代码进行代码选择，

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

如果你想要整个选定的对象，你可能出于其他原因想要处理

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