javascript - 使用对象表示法获取所选 ng-option 的标签

Question

给定一个对象:

obj = {
  foo: 1,
  bar: 2
}

我使用对象数据源表示法创建了一个 ng-option:

<select ng-model="selection" ng-options="key for (key, value) in obj"></select>

此时用户将看到一个下拉列表，其中包含值 foo 和 bar。当他们选择一个选项时，selection 的值分别更改为 1 或 2。

但是我怎样才能返回并找出当前选择的键/标签是什么？

Answer 1

要确定和比较语句中键的值，您只需添加 select您的 ng-options 条款表达。

<select ng-model="selection" ng-options="key as key for (key, value) in obj"></select>

这将设置 selection至 foo或 bar而不是 1或 2您可以从那里做出决定。

来自 Angular 文档

select as label for (key , value) in object

select: The result of this expression will be bound to the model of the parent <select> element. If not specified, select expression will default to value.

更新:

为了同时查看键和值，您可以创建一个新对象作为您的 select .看看这个 Plunkr

<select ng-model="selection" ng-options="{key:key, value:value} as key for (key, value) in obj"></select>

<span>{{selection.key}}</span>
<span>{{selection.value}}</span>