將值綁定到來自不同路由的application.hbs

Question

在Ember.js（ 2.5.1版 ）中，我的application.hbs中包含以下代碼：

<div class="content-wrapper">
    <section class="content-header">
        <h1>
            {{title}}<small>{{description}}</small>
        </h1>
    </section>
    <section class="content">
        {{outlet}}
    </section>
</div>

我應該在哪里聲明{{title}}和{{description}}屬性，以便可以根據當前路線進行更改？ 我想生成一個適用於索引路由的應用程序控制器（ ember g controller application ），但是，如果我導航到應用程序中的其他路由，則無法更改這些屬性。

Answer 1

我會像這樣設計我的application.hbs

    {{partial "app_navbar"}}
        <div class="container">
           {{outlet}}
        </div>
    {{partial "app_footer"}}

並創建一個與路由相關的標頭，我將創建一個組件內容標頭

模板/組件/內容header.hbs

<div class="content-header">
   <h1> {{params.title}} - <small> {{params.description}} </small> </h1>
</div>

在您自定義路線的控制器中

export default Ember.Controller.extend({
    navbarParams: {
       title: 'Foo',
       description: 'Bar'
    }
});

在您的自定義路線模板中

{{content-header params=navbarParams}}

{{! Your other content here}}