首页 > web前端 > js教程 > 正文

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

Barbara Streisand
发布: 2024-11-07 00:32:02
原创
1073 人浏览过

How do I set the value attribute in ng-options for AngularJS?

在 AngularJS 的 ng-options 中设置值

AngularJS 的 ng-options 指令允许开发人员为

为了理解值设置机制,让我们深入研究 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中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板