1. ホーム
  2. javascript

[解決済み] ハンドルを使った変数の受け渡し パーシャル

2022-05-12 19:39:50

質問

現在、express.jsのアプリケーションでhandlebars.jsを扱っています。モジュラーを維持するために、私はすべてのテンプレートをパーシャルに分割しました。

私の問題 : パーシャル呼び出しで変数を渡す方法が見つかりませんでした。例えば、次のようなパーシャルがあるとします。

<div id=myPartial>
    <h1>Headline<h1>
    <p>Lorem ipsum</p>
</div>

このパーシャルを 'myPartial' という名前で登録したと仮定しましょう。そして、別のテンプレートで、次のように言うことができます。

<section>
    {{> myPartial}}
</section>

これは問題なく動作し、パーシャルは期待通りにレンダリングされ、私は幸せな開発者です。しかし、私が今必要としているのは、例えば見出しが与えられているかどうかをパーシャルの中でチェックするために、この呼び出しを通して異なる変数を渡す方法です。次のようなものです。

<div id=myPartial>
    {{#if headline}}
    <h1>{{headline}}</h1>
    {{/if}}
    <p>Lorem Ipsum</p>
</div>

そして、呼び出しは次のようになります。

<section>
    {{> myPartial|'headline':'Headline'}}
</section>

といった具合に

テンプレートをレンダリングする前に、必要なデータをすべて定義することができることは知っています。しかし、私はちょうど説明したようにそれを行う方法が必要です。可能な方法はありますか?

どのように解決するのですか?

ハンドルバーズパーシャルは、パーシャルのコンテキストとなる第2パラメータを取ります。

{{> person this}}

v2.0.0 alpha 以降では、名前付きパラメータのハッシュを渡すこともできます。

{{> person headline='Headline'}}

これらのシナリオのテストを見ることができます。 https://github.com/wycats/handlebars.js/blob/ce74c36118ffed1779889d97e6a2a1028ae61510/spec/qunit_spec.js#L456-L462 https://github.com/wycats/handlebars.js/blob/e290ec24f131f89ddf2c6aeb707a4884d41c3c6d/spec/partials.js#L26-L32