Ember.js：切換嵌套視圖

Question

我有一個標題，其中包含一些登錄/註冊表單，當您單擊各個按鈕時會彈出。

雖然使用jQuery只能正常工作，但我現在已經開始將Ember集成到應用程序中，並且遇到了一些簡單的切換功能的問題。

這裏是基本的HTML標記：

<header> 
    <h1>Page Title<h1> 

    <nav> 
    <a id="toggles-login" class="button {{active_class_binding}}">Login</a> 
    <a id="toggles-signup" class="button {{active_class_binding}}">Signup</a> 
    </nav> 

    <div id="popup-forms"> 
    <div id="login-form"></div> 
    <div id="signup-form"></div> 
    </div> 
<header> 

我完全新的灰燼，我真的不知道如何處理此問題。我唯一想要的是能夠將彈出窗體設置爲Ember.View對象，並使用一些action助手來切換它們。

我真的迷失在這一個。

Answer 1

一個簡單的解決辦法是觸發簡單的動作，以顯示各自的形式：

<a id="toggles-login" class="button {{active_class_binding}}" {{action showLoginForm target="view"}}>Login</a> 
<a id="toggles-signup" class="button {{active_class_binding}}" {{action showSignupForm target="view"}}>Signup</a> 

相應的視圖必須實現這兩個動作：

App.YourView = Ember.View.extend({ 
    showLoginForm : function(){ 
    this.$("#login-form").toggle(); 
    }, 
    showSignupForm : function(){ 
    this.$("#signup-form").toggle(); 
    } 
});