我的问题基于此处提出的类似问题:
Two way databinding in Select2 for AngularJS doesn't work
回答了这个问题,并提供了一个工作正常的插销:http://plnkr.co/edit/MKy2IU?p=preview
主要代码是一个选择框:
<select ui-select2="{width: 'element'}" style="width: 200px" placeholder="All" ng-model="chosenItem">
<option value=""></option>
<option ng-repeat="item in filterItems" value="{{item.id}}">{{item.text}}</option>
</select>
以及更新选择控件的功能。这在插件中效果很好。
我分叉了塞子,只将角度版本从1.0.7更改为:1.2.13(我正在使用)
这是使用角度1.2.13的叉形插塞http://plnkr.co/edit/bcowo3bHKC2XvWDrv6V2?p=preview,您可以在插塞中看到模型已更新,但是视图不受影响,此外,当您打开选择框时,您看到的是已选中但未被选中的值。
任何想法如何使这项工作?
最佳答案
我没有使用过select2插件,但是似乎在进行角度更新时,您的select2指令的优先级需要高于ng-model
'priority,即0
,因此我只为指令提供了优先级1
现在工作。
在ui-select2中更改:-
angular.module('ui.directives').directive('uiSelect2', ['ui.config', '$timeout', function (uiConfig, $timeout) {
var options = {};
if (uiConfig.select2) {
angular.extend(options, uiConfig.select2);
}
return {
require: '?ngModel',
priority: 1, //<--- Here
Demo
而且,如果您真的不想触摸插件源(我建议在以后的任何升级中使用该插件),只需在您的应用中将优先级设置为配置,并在获得该指令的有效版本后将其删除。还要验证他们是否具有已修复的较新版本。
//Remove later once plugin is fixed
app.config(function($provide){
return $provide.decorator('uiSelect2Directive', ['$delegate', function($delegate) {
$delegate[0].priority = 1; //Just set the priority
return $delegate;
}])});
Demo