web-dev-qa-db-ja.com

ハンドルバーでHTMLエンティティをデコードする方法

サーバーから取得したデータをレンダリングするために、構築しているアプリでHandlebarsテンプレートエンジンを使用しています。

デフォルトでHTML値をエスケープすることと、{{{text}}}をHTML要素としてレンダリングするために、トリプルブラケットtext: <p>Example</p>を使用する必要があることを知っています。

問題は、受信したデータ（HTMLタグを含む）がすでにエスケープされている場合はどうすればよいですか。

したがって、次のようなデータを受け取った場合：

text: &lt;p&gt;Example&lt;/p&gt;

ハンドルバーを強制的に変換して通常のHTMLとしてレンダリングするにはどうすればよいですか？

javascripttemplatesmustachehandlebars.js
21
Maverick

最初にそれをデコードしてから、それをトリプルブラケット付きのハンドルバーに渡す必要があります。 jQueryでHTMLエンティティをデコードするための小さなヒントを知っています。

// encoded is "&lt;p&gt;Example&lt;/p&gt" in your example
var decoded = $('<textarea />').html(encoded).val();
// decoded should now return <p>Example</p>
40
Jérôme Mahuet

ハンドルバーはヘルパーを提供し、次のようにカスタムヘルパーを記述しますHandlebars_helpers.js

Handlebars.registerHelper('encodeMyString',function(inputData){
    return new Handlebars.SafeString(inputData);
});

次のように、このヘルパーを.handlebarファイルまたは.hbsファイルで使用します

{{encodeMyString myHTMLData}}

Jqueryの助けがなくても、ハンドルバー内のどこでも使用できます。ヘルパーを使用してデータのみを渡すこともできます。これにより、先頭と末尾にタグが付いたデータが返されます。

7
Vishnu Prasanth G