Javascript 为AngularJS选择2中的双向数据绑定'；行不通

我在AngularJS中使用Select2插件时遇到问题。我可以很好地加载项目，并从我的ng模型中检索所选项目，但我有一个问题，即如果我更新ng模型，下拉列表不会更新

在我看来，代码如下所示：

<select ui-select2 data-placeholder="All" id="filtersSelect" ng-model="chosenFilterItem" ng-options="item.text for item in filterItems">

正如你所看到的，我只是尝试在dropdownlist上设置第三项，但没有预先选择任何项目。是否有其他方法可以预先选择下拉项？

github页面说明：

ui-select2与

不兼容。最好 结果使用

代替

因此，为了避免头痛，我还建议使用带有ng repeat的选项，如中所示：

$scope.filterItems = [
  {id: 1, text: 'Item1'},
  {id: 2, text: 'Item2'},
  {id: 3, text: 'Item3'},
  {id: 4, text: 'Item4'}
];

<select ui-select2 placeholder="All" ng-model="chosenItem">
  <option value=""></option>
  <option ng-repeat="item in filterItems" value="{{item.id}}">{{item.text}}</option>
</select>

$scope.filteriems=[
{id:1，文本：'Item1'}，
{id:2，文本：'Item2'}，
{id:3，文本：'Item3'}，
{id:4，文本：'Item4'}
];
{{item.text}

---

Studie发布了实现Select2的正确方法，但他使用的是“静态”元素

区别在于angular在通过ajax调用元素之前呈现select2，因此在本例中，您需要添加一个ui if语句，以便仅在获得数据后添加该指令

<select ui-select2 placeholder="All" ng-model="chosenFilterItem" **ui-if="filterItems.length>0"**>
 <option value=""></option>
 <option ng-repeat="item in filterItems" value="{{item.id}}">{{item.text}}</option>
</select>

{{item.text}

---

如果不起作用，请创建一个JSFIDLE，加载ajax项目，我会在那里工作

请不要建议使用点表示法，因此请将数据保存在单个变量中，例如

data

。有关更多信息，请参阅这个Egghead.io视频教程：实际上，它证明了select2也将获取延迟元素。我认为Dofs需要在select2指令中包含一个初始预选元素。它可以工作，但是“effect”将是一个初始空值，在ajax完成后，它将显示正确的值。使用ui if只是隐藏初始空值。当然，但他的问题不是在加载数据之前隐藏元素。我的错误是双重的。我使用了ng选项，并将$scope.chosenFilterItem设置为项目，而不是项目。

<select ui-select2 placeholder="All" ng-model="chosenFilterItem" **ui-if="filterItems.length>0"**>
 <option value=""></option>
 <option ng-repeat="item in filterItems" value="{{item.id}}">{{item.text}}</option>
</select>