如何将选项更改传递给Angular-UI ui-select2？

角UI的ui-select2 documentation显示，你可以做类似如下：如何将选项更改传递给Angular-UI ui-select2？

myAppModule.controller('MyController', function($scope) { 
    $scope.select2Options = { 
     allowClear:true 
    }; 
});

<select ui-select2="select2Options" ng-model="select2"> 
    <option value="one">First</option> 
    <option value="two">Second</option> 
    <option value="three">Third</option> 
</select>

然而，变为$ scope.select2Options点后什么也不做。如果ui-select2会在这种情况下观察select2Options并将它们发送给select2，那将会很不错。

我需要动态改变maximumSelectionSize取决于选择什么，做下面的事情显然是错误的做法，因为你不应该在控制器中搞乱DOM。

<select id="mySelect2" ui-select2="{ allowClear: true}" ng-model="select2" ng-change="selectChange()"> 
    <option value="one">First</option> 
    <option value="two">Second</option> 
    <option value="three">Third</option> 
</select>

内部控制器：

$scope.selectChange = function() { 
    if(...) { 
     $("#mySelect2").select2({ maximumSelectionSize: 1 }); 
    } else { 
     $("#mySelect2").select2({ maximumSelectionSize: 0 }); 
    } 
}

我如何通过传递这些类型的选择，选择2不使用DOM和混合在我的控制器的担忧？（我不能拿出一个干净的方式来通过指令做到这一点。）

谢谢！

更新：

基于https://stackoverflow.com/a/16962249/405026，的Stewie的答案，和我自己的测试中，我已经添加以下代码角的UI用户界面，选择的链接方法：

try { 
    scope.uiSelect2 = angular.fromJson(attrs.uiSelect2); 
} catch(e) { 
    scope.$watch(attrs.uiSelect2, function (opts) { 
     if (!opts) return; 
     elm.select2(opts); 
    }, true); 
}

是否有处理ui-select2属性可能是对象字面量或范围对象的情况的更好方法？

来源

2013-06-27 Nate Bundy

ui-select2指令不提供API给这个开箱即用的，所以你必须通过在select2属性上添加一个$ watcher来定制指令以满足你的需要（在指令链接中功能）：

scope.$watch(attrs.uiSelect2, function(opts) { 
    elm.select2(opts); 
}, true);

来源

2013-06-27 22:26:29 Stewie

谢谢Stewie。我已经走上了这条道路，但现在我遇到了如何同时支持ui-select2 =“{maximumSelectionSize：0}”和ui-select2 =“select2Options”语法的问题。我想把它变成一个拉取请求，但首先我需要弄清楚attrs.uiSelect2是否是一个对象字面量或对作用域上的某个东西的引用，我不知道如何去做。 –

如果我们可以弄清楚如何判断attrs.uiSelect2是否真的可以被监视，并且只有作用域。$如果是，我会很乐意接受你的答案！再次感谢。 –

如何将选项更改传递给Angular-UI ui-select2？

回答

相关问题