2

ハンドルバーを使用してノードの階層をレンダリングしようとしています。require.jsとHandlebarsのプラグインを使用して、関連するテンプレートをプルします。パーシャルを再帰的に呼び出す試みは、惨めに失敗します。

サンプルデータ

var data = {
    nodes: [
        {
            title: "node 1",
            nodes: [
                {title: "node 1-1"},
                {title: "node 1-2"}
            ]
        },
        {
            title: "node 2"
        }
    ]
};

電話が必要

require(['hbs!templates/linker/sub'], function(tpl) {
    console.log(tpl(data));
});

基本的なテンプレート
テンプレート/リンカー/サブ

{{#if nodes}}
<ul>
    {{#each nodes}}
        <li>{{title}}
        </li>
    {{/each}}
</ul>
{{/if}}

出力(成功)

<ul>
   <li>node 1</li>
   <li>node 2</li>
</ul>

部分的な
templates/linker/ sub2を含むテンプレート。前のテンプレートを、部分的なものとして呼び出します。

{{#if nodes}}
<ul>
{{#each nodes}}
    <li>{{title}}
        {{> templates_linker_sub }}
    </li>
{{/each}}
</ul>
{{/if}}

出力(成功)

<ul>
    <li>node 1
        <ul>
            <li>node 1-1</li>
            <li>node 1-2</li>
        </ul>
    </li>
    <li>node 2</li>
</ul>

再帰的な部分的な
templates/linker / sub3を含むテンプレートで、自分自身を部分的なものとして呼び出します

{{#if nodes}}
<ul>
{{#each nodes}}
    <li>{{title}}
        {{> templates_linker_sub3 }}
    </li>
{{/each}}
</ul>
{{/if}}

出力(失敗)

require.jsがタイムアウトし、出力がありません。

この設定で再帰的パーシャルを使用できると仮定するのは間違っていますか?または、テンプレートを作成する際に何かを見逃しましたか?

4

2 に答える 2

2

回避策として、以前に登録したパーシャルを適用するカスタムヘルパーを定義しました。パーシャルはすでにコンパイルされており、Handlebars.partials

define(['Handlebars', 'underscore'], function (Handlebars, _) {
    function partial(template, context, options) {
        var f = Handlebars.partials[template];
        if (!_.isFunction(f)) {
            return "";
        }

        return new Handlebars.SafeString(f(context));
    }
    Handlebars.registerHelper('recursivepartial', partial);
    return partial;
});

変更したテンプレートは次のようになります

{{#if nodes}}
<ul>
{{#each nodes}}
    <li>{{title}}
        {{recursivepartial "templates_linker_sub" this}}
    </li>
{{/each}}
</ul>
{{/if}}
于 2012-06-25T16:50:38.050 に答える
1

これは非常に古いことは知っていますが、問題を修正するrequire-handlebars-pluginリポジトリへのプルリクエストを作成しました。現時点では、プラグインはパーシャルを解析し、参照されているすべてのパーシャルを依存関係として追加します(したがって、循環参照を作成します)。https ://github.com/SlexAxton/require-handlebars-plugin/pull/229を参照してください。

于 2015-04-10T18:16:14.840 に答える