Ember를 사용하여 DOM에 새 템플릿을 동적으로 삽입하려면 어떻게해야합니까?

Question

Ember.js 앱이 있습니다. 기본 템플릿에는 클릭 할 때 CSS 툴팁이 표시되어야하는 도움말 버튼이 있습니다. 툴팁에는 별도의 핸들 막대 템플릿이 있습니다.

내가하려는 것은 DOM에 팝업을 삽입하고 표시하는 click 이벤트를 처리하는 것입니다. Ember를 사용하여 DOM에 새 템플릿을 삽입하는 방법을 알아낼 수 없습니다.

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

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

그래서 내가 툴팁을 렌더링하는 이벤트 핸들러에서 무엇을 할 확실하지 않다 :

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

여기 내 기본보기입니다 :

여기에 도움말 버튼이 표시됩니다 내 템플릿입니다 템플리트를 선택하고 표시 할 DOM에 삽입하십시오.

Answer 1

Ember.View의 append 또는 appendTo 방법을 사용하여 새보기를 만들고 DOM에 추가 할 수 있습니다. `replaceIn` 방법도 있습니다

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');