如何使用ng:Options设置选项值

10 浏览
0 Comments

如何使用ng:Options设置选项值

显然,在IE中,AngularJS无法正确构建元素的列表,因此提供了ng:Options指令(参见https://github.com/angular/angular.js/issues/235)。

在查看了源码之后,我能够按照以下方式构建具有所需标签的选项(JSFiddle):







然而,当我用Firebug检查选项时,我发现值是一个数字索引,而不是我想要的键值(我希望初始的k被用作选项的值)。

我还没有深入研究代码,所以不知道是否有其他部分的表达式我漏掉了(正则表达式似乎没有任何其他相关的关键字)。

我希望在这里有人对这个指令非常了解,可以告诉我(1)如何做到这一点,或者(2)我没有办法做到这一点。

0
0 Comments

问题的出现原因是在使用`ng:Options`设置选项值时,希望获取指定属性的键值,即`key`。然而,在HTML中,Angular会将数组的索引值存储为选项的值。为了验证是否获取到了正确的键值,可以在HTML的底部(在最后一个选择列表之后)添加`{{key}}`来查看它。

解决方法是根据需要将`key`从作用域中提取出来,然后在jQuery代码中使用它。另外一种解决方法是在jQuery代码中也构建选择列表(因为`ngOptions`的插值功能在这种场景下没有什么好处,所以选择性使用)。

具体代码如下所示:



以上代码中,`ng:Options`用于设置选项值。`ng-model`用于绑定选择的选项值到`selectedOption`变量上。`item.key as item.value`定义了选项的键值和显示值。`options`数组包含了所有选项的数据。在jQuery代码中,可以通过`$scope.selectedOption`访问到选中的键值。

0