在 AngularJS 的 ng-options 中设置值

AngularJS 的 ng-options 指令允许开发人员填充 标签的选项。出现的一个常见问题是如何为每个选项设置 value 属性。

为了理解值设置机制，让我们深入研究 ngOptions 的语法。它采用以下形式之一的表达式：

对于数组：

label for value in array

对于对象：

label for (key, value) in object

考虑以下示例数组:

array = [{ "value": 1, "text": "1st" }, { "value": 2, "text": "2nd" }];

要使用 ng-options 填充选项，我们可以编写：

在这种情况下，obj.value 将确定每个选项的选定值。

更新：按值表达式跟踪

随着最近的 AngularJS 更新，现在可以使用 Track by 表达式显式指定 value 属性的值：

记住语法

ngOptions 语法可能很难记住。一个有用的类比是将其视为 Python 列表推导式的扩展版本：

[x**2 for x in [1, 2, 3, 4, 5]]

但是，在 ng-options 中，我们使用 as 关键字来区分每个选项显示的值和文本：

person.id as person.name for person in people

对于 JavaScript 对象，语法类似，使用 (key, value) 对：

for (key, value) in object