別のページに部分テンプレートを保存し、子ページに応じて切り替える方法

Question

私のアプリでは、私はhomeページを持っています。このホームページには、子供2人がserviceとcontactとなっています。今のホームページには共通ヘッダーがあります。 （それは他の子ページも必要です）、子ページのロード時には、部分ヘッダーテンプレートを独自にロードする必要があります。

また、別のhbsにも子ページヘッダーを維持する必要があります。 これを達成するには？ここ

私の試みです：

<header> 
    <h2>Home page header </h2> 
    <p class="service">Partial content for Service to be maintained in separate hbs file </p> 
    <p class="contact">Partial content for contact to be maintained in separate page </p> 
</header> 

{{outlet}} 

Twiddle here

Answer 1

あなたはこのようnamed outletsを使用することができます。

service.jsルート

renderTemplate: function() { 
    // Render default outlet 
    this.render(); 
    // render extra outlets 
    this.render("service-header", { 
     outlet: "header", 
     into: "home" 
    }); 
} 

service.jsコントローラ

mypasseddata: 'my passed service data' 

home.hbs

<header> 
    <h2>Home page header </h2> 
    {{outlet 'header'}} 
</header> 

{{outlet}} 

サービスheader.hbsテンプレート

{{yield}} 
    <p class="service">Partial content for Service to be maintained in separate hbs file </p> 
{{mypasseddata}} 

、このmodified twiddle of yoursをご覧ください。