5

サーバー側ノード アプリケーションで Express + Handlebars を使用しており、レンダリングしているページの一部としてクライアント テンプレートをブラウザーに送信したいと考えています。

index.html

<html>
<head>
  <title>{{title}}</title>
</head>
<body>
  <div>
    {{stuff}}    
  </div>
  <script id="more-template" type="text/x-handlebars-template">
    <div>{{more}}</div>
  </script>
</body>

残念ながら、handlebars は #more-template スクリプト ブロック内のものをレンダリングしようとします。{{more}}(これは、サーバー テンプレートのコンテキストで定義されていないため、 を削除するだけです。

script タグ内のものを無視する方法はありますか? (クライアント側のテンプレートが使用できるように)

私はすでにこの質問を見ました: Node.js with Handlebars.js on server and client、私はむしろ1つのテンプレートエンジンを使用したい.

4

2 に答える 2

10

一般に、テンプレートが 2 回コンパイルされている場合 (たとえば、サーバー側のみの場合) で、最初の実行でテンプレート タグを無視したい場合は、バックスラッシュを追加してハンドルバーにそれらを無視するように指示するだけです。

{{variable1}} \{{variable2}}

variable1に設定しvalue1variable2未定義でコンパイルすると、次のようになります。

value1 {{variable2}}

(2 番目のタグを空の文字列に置き換える代わりに)。

variable2に設定して 2 番目の実行をコンパイルすると、次のようvalue2になります。

value1 value2

完璧な解決策ではありません (ハンドルバーが未定義の変数をそのままにしておく設定になります) が、私の特別なケースでは機能します。

于 2015-05-16T14:35:02.680 に答える
5

そのため、クライアント テンプレートを簡単に無視する方法は見つかりませんでしたが、一般的なコンセンサスは、クライアント テンプレートをプリコンパイルすることです。

  1. ハンドルバーをグローバルにインストールnpm install handlebars -g
  2. テンプレートをプリコンパイルするhandlebars client-template1.handlebars -f templates.js
  3. templates.js を含める<script src="templates.js"></script>
  4. テンプレートを実行するvar html = Handlebars.templates["client-template1"](context);

追加情報
Handlebars.js (jQuery Mobile 環境) でコンパイル済みテンプレートを使用する
http://handlebarsjs.com/precompilation.html

于 2012-12-14T18:49:09.297 に答える