如何在 AngularJS 的 ng-options 中设置 value 属性？

在 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 填充选项，我们可以编写：

<select ng-options="obj.text as obj.value for obj in array"></select>

在这种情况下，obj.value 将确定所选的选项

更新：按值表达式跟踪

通过最近的 AngularJS 更新，现在可以使用跟踪显式指定 value 属性的值表达式：

<select ng-options="obj.text for obj in array track by obj.value"></select>

记住语法

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 对象，语法类似，使用（键，值）对：

for (key, value) in object

以上是如何在 AngularJS 的 ng-options 中设置 value 属性？的详细内容。更多信息请关注PHP中文网其他相关文章！