1

新しいサイトのプロトタイピングにアセンブルを使用しています。

Brad Frost がpattern labで伝道しているのと同じように、コードを大幅にモジュール化したいと考えています。

例

基本的に、ヒーロー部分 (「分子」) 内で使用されるタイトル部分 (パターン ラボの「原子」) を使用したいと思います。

タイトル.hbs

<h1 class="{{class}}">{{text}}</h1>


ヒーロー.hbs

<section class="hero-unit">
    {{!-- image and stuff --}}
    <header class="hero-description">
        {{> title }}
        {{> subTitle }}
    </header>
</section>


ヒーローのパーシャルはジェネリックであると想定されています。特定のページごとに JSON ファイルからデータを渡したい。私のページでは、ブロックを提供するデフォルトのレイアウトを使用しています。例えば：

デフォルト.hbs

<!DOCTYPE html>
<html>
    <head>
        ...
    </head>
    <body>
        {{#block "hero"}}{{/block}} 
        {{#block "body"}}{{/block}}
    </body>
</html>


myPageWithHero.hbs

{{#extend "default"}}
    {{#content "hero"}}
        {{ >hero }}
    {{/content}}
    {{#content "body"}}
        {{!-- myPageContent --}}
    {{/content}}
{{/extend}}


今、私が持っている myPageWithHero.json ファイルを介して、ヒーロー パーシャル内にあるタイトル パーシャル内に {{text}} を設定したいと思います。それはまったく可能ですか？または、私のアプローチ (この非常に単純化された例で説明したもの) は完全に混乱していますか?

任意のポインターに乾杯! :-)

4

1 に答える 1

0

@polarbirke からのデータを使用したいのでmyPageWithHero.json、そのデータはpageレンダリング時にオブジェクトで使用できるため、そのオブジェクトをパーシャルmyPageWithHero.hbsに渡すことができます。heroこれにより、そのパーシャルのコンテキストがセットアップされ、titleパーシャルはそのコンテキストを継承します。

{{#extend "base"}}
  {{#content "hero"}}
    {{> hero page}}
  {{/content}}
  {{#content "body"}}
    {{!-- myPageContent --}}
  {{/content}}
{{/extend}}

代わりに使用したいデータに他のオブジェクトがある場合は、代わりにそれを渡すことができます。

data.json

{
  "title1": {
    "class": "success",
    "text": "Good Title"
  },
  "title2": {
    "class": "error",
    "text": "Bad Title"
  }
}

myPageWithHero.hbs

{{#extend "base"}}
  {{#content "hero"}}
    {{> hero title1}}
  {{/content}}
  {{#content "body"}}
    {{!-- myPageContent --}}
  {{/content}}
{{/extend}}

ご不明な点がございましたら、お気軽にお問い合わせください。

于 2014-05-09T21:04:04.713 に答える