如何動態插入一個新的模板到帶有Ember的DOM中？

Question

我有一個Ember.js應用程序。在主模板中，我有一個幫助按鈕，單擊時應顯示一個CSS工具提示。我有工具提示是一個單獨的Handlebars模板。

我想要做的是處理click事件，將彈出窗口插入DOM並顯示它。我無法弄清楚如何使用Ember將新模板插入到DOM中。

這裏是我的模板在顯示幫助按鈕：

<div id="status_help" class="icon_help" {{action "helpClicked"}}></div> 

這是我的主要觀點：

var checkbox = Ember.Checkbox.extend({ 
    templateName: 'checkbox', 
    helpClicked: function(e) { 
     // Not sure what to do here 
    } 
})); 

var tooltip = Ember.View.extend({ 
    templateName: 'tooltip' 
}); 

所以我不知道在事件處理程序來呈現提示怎麼辦模板並將其注入到要顯示的DOM中。

Answer 1

您可以使用Ember.View的append或appendTo方法創建新視圖並將其附加到DOM。

App.MyView = Ember.View.extend({ 
    templateName: 'a_template' 
}) 

var view = App.MyView.create(); 

// Append the view to the document body 
view.append(); 
// ...or append to any element described using 
// a jQuery-compatible selector. 
view.appendTo('#my-div');