【问题标题】:Two way databinding in Select2 for AngularJS doesn't work in angular 1.2.13Select2 for AngularJS 中的两种方式数据绑定在 Angular 1.2.13 中不起作用
【发布时间】:2014-09-05 21:10:05
【问题描述】:

我的问题基于此处提出的类似问题: Two way databinding in Select2 for AngularJS doesn't work

这个问题得到了回答,并提供了一个工作的 plunker: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>

还有一个更新选择控件的函数。这在 plunker 中效果很好。

我分叉了 plunker,只将 angular 版本从:1.0.7 更改为:1.2.13(我正在使用)

这是使用 Angular 1.2.13 的分叉 plunker http://plnkr.co/edit/bcowo3bHKC2XvWDrv6V2?p=preview,您可以在 plunker 中看到模型已更新但视图不受影响,此外,当您打开选择框时,您会看到该值已被选中,但没有选择。

知道如何实现吗?

【问题讨论】:

    标签: javascript angularjs angularjs-directive jquery-select2 angularjs-ng-model


    【解决方案1】:

    我没有使用过 select2 插件,但似乎随着您的角度更新,您的 select2 指令的优先级需要高于 ng-model'priority 即 0,所以我只是为指令,它现在可以工作了。

    在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

    【讨论】:

    • 哇!你到底是怎么找到那个的??!!你是我的英雄!
    猜你喜欢
    • 2013-06-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-08-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-06-27
    相关资源
    最近更新 更多