Question

Angular＆lt; 1.4使用ng-options如下所示：

<select ng-options="option.value as option.label for option in options" ng-model="selectedValue">

使用以下数组选项：

[{ value:"4_220588",label:"dropdown 1-test value 1"},{value:"4_220589",label:"dropdown 1-test value 2"}]

如果你看一下结果HTML就像你期望的那样：

<select ng-options="option.value as option.label for option in options" ng-model="selectedValue" class="ng-pristine ng-valid ng-touched">
    <option value="" class="">-- SELECT ONE --</option>
    <option value="0" label="dropdown 1-test value 1">dropdown 1-test value 1</option>
    <option value="1" label="dropdown 1-test value 2">dropdown 1-test value 2</option>
</select>

只要将角度版本更改为Angular 1.4+，选项值属性就会变得混乱。以下是使用更新版本角度的相同ng-options的输出：

<select ng-options="option.value as option.label for option in options" ng-model="selectedValue" class="ng-pristine ng-valid ng-empty ng-touched">
    <option value="" class="" selected="selected">-- SELECT ONE --</option>
    <option label="dropdown 1-test value 1" value="string:4_220588">dropdown 1-test value 1</option>
    <option label="dropdown 1-test value 2" value="string:4_220589">dropdown 1-test value 2</option>
</select>

将值显示为数组索引的解决方案是什么？

这是plnkr：http://plnkr.co/edit/3CTUI9b9ntTGWhXDNQI5?p=preview

Answer 1

一种解决方案是在选项上使用C。

ng-repeat

这是您更新的Plunkr。

Answer 2

这应该可以解决问题：

<select ng-options="index as option.label for (index, option) in options2" ng-model="vm.selectedValue">
    <option value="">-- SELECT ONE --</option>
  </select>

在渲染时，所选选项的值将为string：index，但将输出所需的值而不包含类型。这是您编辑的plunker，其中包含所选值中的预期结果：

Plunker

Answer 3

您的应用程序逻辑不应对下拉列表中的<img src="<?php echo base_url()?>/uploads/<?= $row->filename?>" width="100">属性敏感，因为value将正确设置模型，而不管HTML中输出的是什么。如果应用程序逻辑确实需要此属性的特定格式，则有3种方法可以处理此breaking change。

使用ng-model代替ng-repeat。这是最不推荐的选项，因为它会改变选择列表的显着工作方式。
使用ng-options子句强制执行您期望的密钥格式，即track by。这假定option.value as option.label for option in options track by option.value存在并且是您希望表示的值。 http://plnkr.co/edit/TSXfkpf1lhsE9QYa2NAc?p=preview
将应用程序逻辑更改为期望option.value，或者最好更正逻辑，以便它仅依赖于hashkey。

Angular ng-options打破1.4+

3 个答案: