javascript - Handlebars.js のブロック ヘルパーに対するクエリ

Question

次のようなテンプレートに製品ブロックがあります。

<script type="text/x-handlebars-template" id="tmpl-person">
    <div class="product">
       <!-- Product details here -->
    </div>
</script>

私がやりたいのは、 data として取得した person の配列から、3 person ごとに、という名前のコンテナと<div class="row-fluid"></div>その中に 3 人を挿入したい場合です。次に、行流体コンテナとその中に 3 人を挿入します。helpers を使用してこれを達成するにはどうすればよいですか? 手伝ってくれてありがとう。

Answer 1

このようなものを使用できます

Handlebars.registerHelper('each', function(context, block) {
  var ret = "";

  for(var i=0, j=context.length; i<j; i++) {
    ret = ret + "<li>" + block(context[i]) + "</li>";
  }

if( i % 3 == 0)
   ret = ret + <div class="row-fluid"></div>

  return ret;
});

そして、次のようにカスタムイテレータを定義できます

<script type="text/x-handlebars-template" id="tmpl-person">
    {{#each productInfo}}
    <div class="product">
       <!-- Product details here -->
    </div>
    {{/each}}
</script>