angularjs - IE10 选择标签显示带有大括号

Question

首先，我一直在尝试在较小的情况下重现此错误，但失败了。所以我只想发布到目前为止我所掌握的所有信息。

我有一个指令(指令A)调用另一个指令(指令B)。指令B包含<select>标记为 ng-model='fileId' 。选项列表由基于 fileList 数组的 ng-repeated 填充，所选集也设置为变量 (selectedFile)。然后允许用户上传新文件。当通过 AJAX API 调用上传新文件时，它将返回来自服务器的新文件列表。然后我用返回的列表更新 fileList。我还使用新更新的文件更新 selectedFile 和 fileId。但是，当 fileId 更新时，该选项将仅显示 {{fileName}}，而不是其界限值。单击下拉菜单将修复绑定(bind)。

<select ng-model='fileId'>
  <option ng-repeat="p in fileList" selected={selectedFileId == p.fileId}>{{p.fileName}}</option>
</select>

js

...
//AJAX call, return a result
s.fileList = result.items;
s.fileId = result.newId;
s.selectedfileId = result.newId;

只是想知道你们是否遇到过类似的问题，因为它只发生在 IE 中。

Answer 1

在 select 标签上使用 ng-option 属性，而不是在 option 标签上使用 ng-repeat ，一切正常。一个关键的考虑因素是让下拉列表的选择值与模型值匹配。

<select ng-model='selectedfileId' ng-options='file.id as file.name for  file in fileList' ></select>

更多详细信息请参见:https://docs.angularjs.org/api/ng/directive/ngOptions