各ヘルパーのハンドルバーのインデックスを取得するには？

Question

私は自分のプロジェクトでテンプレートとしてHandlebarsを使用しています。ハンドルバーの "各"ヘルパーの現在の反復のインデックスを取得する方法はありますか？

Answer 1

新しいバージョンのHandlebarsインデックス（またはオブジェクト反復の場合はキー）は、標準の各ヘルパーでデフォルトで提供されます。

---

から抜粋：https://github.com/wycats/handlebars.js/issues/250#issuecomment-9514811

電流アレイアイテムが@Indexを介して、今いくつかの時間に利用可能となっているのインデックス：オブジェクトの反復のため

{{#each array}} 
    {{@index}}: {{this}} 
{{/each}} 

、代わり@key使用：

{{#each object}} 
    {{@key}}: {{this}} 
{{/each}} 

Answer 2

これはEmberの新しいバージョンで変更されました。配列の場合

：

{{#each array}} 
    {{_view.contentIndex}}: {{this}} 
{{/each}} 

#eachブロックは、もはやオブジェクト上で動作しますように見えません。私の提案は、あなた自身のヘルパー機能をロールバックすることです。

ありがとうございましたtip

Answer 3

私はこれが遅すぎることを知っています。しかし、私は次のコードでこの問題を解決：

Javaスクリプト：

Handlebars.registerHelper('eachData', function(context, options) { 
     var fn = options.fn, inverse = options.inverse, ctx; 
     var ret = ""; 

     if(context && context.length > 0) { 
     for(var i=0, j=context.length; i<j; i++) { 
      ctx = Object.create(context[i]); 
      ctx.index = i; 
      ret = ret + fn(ctx); 
     } 
     } else { 
     ret = inverse(this); 
     } 
     return ret; 
}); 

はHTML：

：

{{#eachData items}} 
{{index}} // You got here start with 0 index 
{{/eachData}} 

あなたは1とあなたのインデックスを開始したい場合は、次のコードを実行する必要がありますJavascript：

Handlebars.registerHelper('eachData', function(context, options) { 
     var fn = options.fn, inverse = options.inverse, ctx; 
     var ret = ""; 

     if(context && context.length > 0) { 
     for(var i=0, j=context.length; i<j; i++) { 
      ctx = Object.create(context[i]); 
      ctx.index = i; 
      ret = ret + fn(ctx); 
     } 
     } else { 
     ret = inverse(this); 
     } 
     return ret; 
    }); 

Handlebars.registerHelper("math", function(lvalue, operator, rvalue, options) { 
    lvalue = parseFloat(lvalue); 
    rvalue = parseFloat(rvalue); 

    return { 
     "+": lvalue + rvalue 
    }[operator]; 
}); 

HTML：

{{#eachData items}} 
    {{math index "+" 1}} // You got here start with 1 index 
{{/eachData}} 

ありがとうございました。以降ハンドルバージョン3.0で

Answer 4

、この特定の例で

{{#each users as |user userId|}} 
    Id: {{userId}} Name: {{user.name}} 
{{/each}} 

は、ユーザは、現在のコンテキストと同じ値を有し、useridは、反復のインデックス値を有するであろう。 参照してください - ブロックヘルパーセクションでhttp://handlebarsjs.com/block_helpers.html

Answer 5

アレイ：

{{#each array}} 
    {{@index}}: {{this}} 
{{/each}} 

を使用すると、オブジェクトの配列を持っている場合...あなたは子供を反復処理することができます

{{#each array}} 
    //each this = { key: value, key: value, ...} 
    {{#each this}} 
     //each key=@key and value=this of child object 
     {{@key}}: {{this}} 
     //Or get index number of parent array looping 
     {{@../index}} 
    {{/each}} 
{{/each}} 

オブジェクト：

を

{{#each object}} 
    {{@key}}: {{this}} 
{{/each}} 

あなたが {{@../key}}