10

これには答えがないように思われるので:部分的なハンドルバーを介して変数を渡すことはまだありません。現在、この作業を行うための小さな回避策に取り組んでいます。したがって、アイデアは、特定のテンプレートを可能な値でレンダリングするヘルパー関数を登録することです。ビットコードで理解が深まります。

これは、ヘルパーを呼び出す方法です。

<div>
    {{myHelper}}
</div>

このヘルパーは、次の小さなコードで登録されます。

hbs.registerHelper(name, function (args) {
    args = args || {};
    var template = hbs.compile(fs.readFileSync(__dirname + '/' + file, 'utf8'));
    return template(args);
});

このスニペットをループに入れて、さまざまなヘルパーを一度に登録します。これは、'name' と 'file' が指定されていることを意味します。

さて、私はこのようなことをすることができます：

// 'values' could be something like this:

var values = { headline: 'HEADLINE' }

<div>
    {{myHelper values}}
</div>

ヘルパー内で、特定の値が指定されているかどうかをテストできるようになりました。

// myHelper template

<div>
    {{#if headline}}
    <h1>{{headline}}</h1>
    {{/if}}
    <p>Lorem ipsum</p>
</div>

この小さな回避策はうまくいきますが、問題が 1 つあります。上で説明したようにヘルパーを登録すると、プレーンな HTML エスケープ文字列が返されます。そのため、ヘルパーを呼び出しても、レンダリングされた HTML スニペットは出力されません。HTML をエスケープ文字列として出力します。

コード スニペットが HTML を HTML として返す方法を知っている人はいますか?

/パスカル

4

2 に答える 2

21

ハンドルバーのドキュメントから:

ハンドルバーは、Handlebars.SafeString をエスケープしません。独自の HTML を生成するヘルパーを作成する場合、通常は新しい Handlebars.SafeString(result) を返す必要があります。このような状況では、パラメーターを手動でエスケープする必要があります。

試す

hbs.registerHelper(name, function (args) {
    args = args || {};
    var template = hbs.compile(fs.readFileSync(__dirname + '/' + file, 'utf8'));

    // return new hbs.SafeString(template(args));
    // From @Maroshii 
    // the SafeString method must be accessed through hbs.handlebars 
    // and not directly through hbs
    // https://github.com/donpark/hbs#handlebars

    return new hbs.handlebars.SafeString(template(args));
});
于 2012-07-23T12:03:21.727 に答える