如何根據菜單中選擇的內容更改div的內容

-1

請耐心等待，這個問題很粗糙。我是Ember js的新手，並且在視圖控制器模板路線之間有很多混淆。我有這個基本要求，左邊有一個菜單，項目users，organizations。和中心的一個div，截至目前，當我點擊用戶時，我已經給出了一個鏈接到/users的路線。對於組織/organizations路由，這是一個不同的模板。我想在居中的div中顯示它們。不知道該怎麼做。我認爲這與孩子的觀點有關，但是從一開始就感到麻木。我只需要在如何實現這一目標的工作流程中提供幫助。如何根據菜單中選擇的內容更改div的內容

編輯：

下面是基本的代碼，我有這個頁面調用home。模板home.hbs：

<ul class="nav nav-list"> 
     <li> 
      {{#link-to 'users'}} Users{{/link-to}} 
     </li> 
     <li> 
      {{#link-to 'organizations'}} Organizations {{/link-to}} 
     </li> 
</ul> 

<div class="summary-width span10" id="home-container"> 
</div>

同樣有users.hbs和organization.hbs。

當用戶點擊用戶鏈接時，我想讓用戶模板顯示在home-container div中。否則組織模板。

來源

2015-04-30 inquisitive

你可以給DIV一個ID並用JavaScript設置innerHTML。 – durbnpoisn

@durbnpoisn：這是我在點擊用戶鏈接時所寫的行，'Ember。$（「＃dashboard-widgets-container」）。innerHTML =「用戶」;'但它似乎沒有做任何事情，沒有文字「用戶」打印在div – inquisitive

@Inquisitive，如果你必須用jQuery做你喜歡做的事情，你完全錯過了根本沒有使用框架。閱讀this – sunrize920

通常你會用路線描述你所描述的。這是您的application.hbs即與應用程序路由和控制器關聯的模板。

那麼您需要有一個路由器：

import Ember from 'ember'; 
import config from './config/environment'; 

var Router = Ember.Router.extend({ 
    location: config.locationType 
}); 

Router.map(function() { 
    this.route('organizations'); 
    this.route('users'); 
}); 

export default Router;

{{link-to 'users'}}將進入用戶的路線，呼籲所有的鉤子，如果它不存在創建控制器，該控制器設置型號，並將users.hbs模板渲染到應用程序模板的插座中。您所描述的home.hbs應該重命名爲index.hbs，因爲默認情況下，當訪問/（或任何基本網址）時，Ember會將您的index.hbs模板呈現出口。當然，它可以使不同的模板是默認的，但涉及更多的代碼，所以只要改變你的home.hbs到index.hbs

編輯：添加到您的路由器：

this.resource('home', function(){ 
     this.route('organizations'); 
     this.route('users'); 
    });

如果這些路線是真正的嵌套低於你的家鄉路線。你給的鏈接需要如果你不嵌套這樣的改變，以{{#link-to 'home.organizations'}}

，然後{{#link-to 'users'}}將使users.hbs文件到應用程序的插座。這就是Ember和路由器的工作原理。

如果您不能嵌套出於某種原因，然後更改link-to到actions，使{{outlet}}一個叫出口像{{outlet 'named'}}並在routes/home.js行動哈希，使行動是this.renderTemplate()到指定的出口。看看api的具體操作方法

來源

2015-04-30 20:54:14 sunrize920

我有一個不同的應用程序模板，帶有頁眉和頁腳，這是主頁儀表板頁面。其他頁面就像登錄等我不能重命名它來索引hbs。 – inquisitive

那麼你需要讓用戶和組織成爲主線路的嵌套路線 – sunrize920

好吧，這就是我需要的，thnx。如果用戶模板有一個調用來顯示所有用戶的名字，那麼它在模型中獲取它，但不會打印任何東西，除了第二種方法，渲染只是呈現模板，在回調 – inquisitive

如何根據菜單中選擇的內容更改div的內容

回答

相關問題