Select 指令在异步加载选项时不选择选项

Question

我有一个 <select> 指令，它的选项是异步加载的。 ng-model 属性指向的变量在加载选项之前就已经存在。但是，在加载选项后，正确的选项不是 selected。相反，select 变为空白。我创建了一个 plunk 来演示这种行为：http://plnkr.co/edit/KNunC6.

Answer 1

https://github.com/angular/angular.js/issues/9714#ref-pullrequest-53337829

这似乎是一个 angular 核心错误。我猜你使用 ng-repeat 和 ng-checked 会更成功。

Answer 2

我认为这可以解决您的问题。这是 plunker。问题是您在承诺完成之前初始化 ngModel 。 ngModel 需要在列表填充后进行初始化，以便 angular 可以找出哪个 option 是 selected。此外，ngOptions 有时很棘手，因为 angular 为每个 option 分配一个唯一的 id 并忽略 value 属性。我也遇到过几次这个问题，讨厌！

Answer 3

选项的值部分与标签部分的值相同时出现问题。

对于您的情况，value == id == 'Canada' 和 label == name == 'Canada' 也是如此。如果您将其中之一更改为其他任何内容，它将起作用。我不确定为什么这是个问题，但只要改变就可以了。

示例：将名称从 'Canada' 更改为 'Canada '：

[
    { id: 'Canada', name: 'Canada ' }, 
    { id: 'US', name: 'United States of America' }
]

Select 指令在异步加载选项时不选择选项

Select directive not selecting option when options are loaded asynchronously

angularjs

angularjs-directive