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

在 AngularJS 的 ng-options 中设置 Value 属性

AngularJS 开发人员面临的一个常见挑战是在使用 ng 时设置 value 属性-options 指令填充选择标签。虽然文档可能看起来不明确，但解决方案在于理解表达式。

ngOptions 语法

如 AngularJS 文档中所示，ngOptions 接受以下之一中的理解表达式：以下格式：

• 数组数据源：

  • 数组中值的标签
  • 选择作为值的标签在数组中
  • 为数组中的值按组进行标签
  • 通过trackexpr为数组中的值按组选择标签组

• 对象数据源：

  • 对象中（键，值）的标签
  • 选择对象中（键，值）的标签
  • 为对象中的（键，值）分组分组
  • 为对象中的（键，值）分组分组选择标签

设置数组数据源的值

在您的情况下，如果您有一个具有“value”和“text”属性的对象数组，则用于设置 value 属性的适当理解表达式是：

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

使用“track by”表达式

在 AngularJS 的最新更新中，“track by”表达式可用于显式设置 select 的值元素的 value 属性：

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

记忆辅助

为了简化记住这个复杂的语法，可以将其视为 Python 列表推导式的扩展。因此，它遵循以下格式：

label as value for item in collection track by trackexpr

例如，以下表达式是等效的：

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

person.name for person in people

obj.value as obj.text for obj in array

person as person.name for person in people

附加注释

• as 关键字还可以用来设置 label 属性。
• 同时设置 label 和 value 属性，可以为显示和表单提交指定不同的值。

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