Angular 模型更改时更新 Select2 选定元素答案

【问题标题】：Updating Select2 selected elements when Angular model changesAngular 模型更改时更新 Select2 选定元素
【发布时间】：2014-03-14 11:26:40
【问题描述】：

我正在开发一个通过 AngularJS UI 部署软件的项目。在当前视图中，您必须选择部署的环境。可能的环境列表存储在范围中，并且是构建选择的选项的来源：

<select ui-select2="{ }" data-placeholder="All Environments" ng-model="transformParams.EnvironmentIds" multiple="multiple" class="input-xxlarge">
  <option ng-repeat="environment in environments" value="{{ environment.Id }}">{{ environment.Name }}</option>
</select>

同样在此页面上，有一个下拉菜单可以更改要为其设置环境的当前项目。从下拉列表中选择现有项目应从现有项目中获取Environments 属性，并在我的 Select2 框中选择正确的元素。这显然会更新transformParams.EnvironmentIds 模型。我尝试更新该模型以更改选择的环境，但无济于事。

我已经看到了错误修复 to Angular 1.2，但我被困在 1.0.7 并且在这个阶段没有升级 Angular 的选项。

【问题讨论】：

标签： angularjs angularjs-select2

【解决方案1】：

我通过使用 select2 的一些选项解决了这个问题：

<select ui-select2="selectOptions" data-placeholder="All Environments" ng-model="transformParams.EnvironmentIds" multiple="multiple" class="input-xxlarge">
    <option ng-repeat="env in environments" value="{{ env.Id }}">{{ env.Name }}</option>
</select>

在控制器中定义选项：

$scope.selectOptions = {
    'multiple': true,
    'simple_tags': true,
    'initSelection': function (element, callback) {
        callback($(element).data('$ngModelController').$modelValue);
    }
}

【讨论】：