Angular UI select2 指令 - 编程方式更新模型不反映在小部件上

Question

我试图以编程方式更新select2模型，并使视图刷新，但似乎没有起作用。

这是一个从Angular UI项目派生的样例plunker：http://plnkr.co/edit/kQROgr?p=preview

我按照select2文档中的initSelection()指南尝试过了(http://ivaynberg.github.com/select2/ "Reacting to external value changes")，但这并没有奏效。我还尝试了使用select2 3.3.2，但也无法解决问题。

有两个问题： 1）单击“Update-Model”按钮，模型会更新，但它不会将标签添加到select2小部件中。 2）单击“Update-Model”按钮，然后使用select2选择第二个标签，由“Update-Model”添加的第一个标签会消失。

- jonathan

---

这可能有所帮助？ https://github.com/angular-ui/angular-ui/issues/455 - DanB

你能让它工作了吗？我遇到了同样的问题。 - testing123

我尽力了...我知道它可以工作，因为我在创建的应用程序中到处使用它，并且我经常将外部数据推送到模态框中并更新select2，所以我确定这里还有其他问题... - btm1

@jonathan，我有同样的问题。你的情况和我的共同点是源列表似乎在变化。在你的情况下，在“选项”中指定的“查询”方法中发生了变化。在我的情况下，我使用“|”在“ng-repeat”中应用了一系列的angularjs过滤器。我认为这必须是对象引用比较失败了。如果你有任何更新，请在这里回复。 - Faredoon

嘿，Jonathan，你能提供一个fiddle吗？ - Sushrut

Answer 1

我知道这个问题有点老，但是嘿...我找到了它，却不知道答案。

我通过设置模型，然后在select2Options配置上调用initSelection()来实现我想要的功能。

所以我的配置是这样的：

$scope.select2Options = {
allowClear: true
minimumInputLength: 3
quietMillis: 1000
initSelection: ->
  $scope.property
query: (query)->
  Properties.query({q: query.term}, (response)->
    data = {results: processData(response['properties'])}
    query.callback(data)
    )

  processData = (data)->
    results = []
    angular.forEach(data, (item, index)->
      results.push(item)
      )
    return results

}

然后我让我的模态框返回新创建的对象，就像这样：

modalInstance.result.then((result)->
    $scope.property = result
    $scope.select2Options.initSelection()
  )

基本上，一旦更新了模型，我就必须手动重新初始化select2小部件。我认为如果你真的想这样做，可以使用$scope.$watch来处理，但除非您从几个地方更新属性，否则这可能是浪费。

- Tyrone Wilson