重新綁定Ember在JQuery替換元素後查看

Question

我有一個Ember視圖，它在didInsertElement()鉤子中加載一個插件。該插件用它自己的元素替換視圖元素。元素保留它的Ember id，但似乎失去了綁定的事件處理程序。

是否可以將視圖重新綁定到新元素以保留事件處理功能？

這就是我想：

App.MyView = App.AbstractView.extend({ 

    tagName: 'canvas', 

    // plugin loading goes here because this.element 
    // does not yet exist in init(), and the plugin 
    // needs an id 
    didInsertElement: function() { 

    // load jquery plugin. this plugin replaces the root 
    // element of this view, leaving the id intact 
    loadPlugin(this.get('element').id); 

    var that = this; 

    // rebind click 
    $(this.get('element')).click(function(e){ 
     that.click(e); 
    }); 
    }, 

    // doesn't work... 
    click: function(evt) { 
    alert("test"); 
    }, 
}); 

Answer 1

您嘗試也許是可能的，但你最好應用插件的視圖的子元素。這將保持jQuery和Ember的分離，減少你的代碼依賴任何框架的實現細節。

完成的緣故：

模板：

<div class="replace-me"></div> 

查看：

App.MyView = App.View.extend({ 
    didInsertElement: function() { 
    // use handy local jQuery selector 
    this.$('.replace-me').myJQueryPlugin(); 
    }, 

    click: function(event) { 
    // smooth sailing as usual 
    } 
});