Requirejs Backbone和jqueryui

Question

我有一個骨幹應用程序，當我點擊進入應用程序之外的一個元素時，我在div內創建了另一個可以拖動和調整大小的div。 我已經試過這樣：

我requirejs的配置文件：

require.config({ 
    paths:{ 
     jquery:'libs/jquery/jquery-2.0.2.min', 
     underscore:'libs/underscore/underscore-min', 
     backbone:'libs/backbone/backbone-min', 
     text:'libs/require/text', 
     jquery_ajaxform : 'libs/jquery/jquery.form', 
     jquery_ui : 'libs/jquery/jquery-ui-1.10.3.custom.min'  
    }, 
    shim: { 
     jquery: { 
      exports: '$' 
     }, 
     underscore: { 
      exports: '_' 
     }, 
     backbone: { 
      deps: ["underscore", "jquery"], 
      exports: "Backbone" 
     } 
    } 
}); 

require(['views/design'], function(DesignView){ 
    var designView = new DesignView(); 
}); 

我DesignView：

define(['jquery' , 
     'backbone', 
     'jquery_ui', 
     'models/design', 
     'collections/design', 
     'views/element', 
     "text!templates/design.html" 
     ], 
    function($, Backbone, jQueryUI, DesignModel, DesignCollection, ElementView, tmplDesign){ 
    var DesignView = Backbone.View.extend({ 
     initialize: function(){ 
      this.$el = $('#layout'); 
      this.template = tmplDesign; 
      console.log('initialize DesignView'); 
      this.collection = new DesignCollection(); 
      var here = this; 
      $('#insert-dynamic-element').click(function(){ 
       var element = { name:'img', type:'image' }; 
       here.collection.addElement(element); 
       here.render(); 
       $('.drag-item').draggable({"containment" : "parent"}) 
      }); 
     }, 
     render: function(){ 
      var template = _.template(this.template, {elements:this.collection.toJSON()}); 
      this.$el.empty(); 
      this.$el.append(template); 
     } 
    }) 

    return DesignView; 
}); 

模板：

<% 
_.forEach(elements, function (element, index) { 
    if(element.type == 'image'){ 
     console.log('fai'); 
    %> 
    <p>fsfdsfds</p> 
     <div class="insert-container-img drag-item"> 
      <p>IMG</p> 
     </div> 
    <% 
    } 
}); %> 

我找回這個錯誤：

Uncaught TypeError: Object [object Object] has no method 'draggable' 

錯誤是我認爲，因爲div元素是動態創建的。
那麼我怎麼能關聯可拖動和可調整我的div？ 謝謝

Answer 1

您將需要爲jquery-ui定義一個墊片，因爲它不是AMD模塊，它依賴於jQuery。

shim: { 
    //... 
    jquery_ui: { 
    exports: '$', 
     deps: ['jquery'] 
    } 
}