最初のラジオボタンがハンドルバーのテンプレートにチェックされています

Question

を簡単に得ることができますハンドバールのテンプレートで最初のラジオボタンがチェックされています。 TKS

テンプレート：

<form> 
    {{#each this}} 
     <input value="{{value}}" /> 
    {{/each}} 
</form> 

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

<form> 
    <input value="val 1" checked /> 
    <input value="val 2" /> 
    <input value="val 3" /> 
</form> 

おかげですべてを：~~~~

レンダリング期待しています。

<form> 
    {{#each this}} 
     <input type="radio" value="{{value}}" {{#if sel}}checked="checked"{{/if}} /> 
    {{/each}} 
</form> 

をしてからsel値を追加します。ハンドルバーで

Answer 1

{{#each}}は、あなたのテンプレートとデータを少し変更することなく、それを行うことはできませんので、あなたが繰り返し回数またはそのような何かへのアクセスを与えるものではありません。デモ

var tmpl = Handlebars.compile($('#t').html()); 
var html = tmpl([ 
    { value: 'val 1', sel: true }, 
    { value: 'val 2', sel: false }, 
    { value: 'val 3', sel: false } 
]); 

：あなたのデータへのhttp://jsfiddle.net/ambiguous/27Ywu/

あなたはもちろん、ちょうどを設定することができます

data = [ ... ]; 
data[0].sel = true; 
var html = tmpl(data); 

デモ：あなたのデータ配列の最初の要素にhttp://jsfiddle.net/ambiguous/yA5WL/

また、あなたはHTMLを持った後、最初のものをチェックするためのjQueryを使用します。

// Add the HTML to the DOM... 
$('form input:first').prop('checked', true); // Or whatever selector matches your HTML 

デモ：http://jsfiddle.net/ambiguous/sPV9D/

---

ハンドルバーの新しいバージョンは012です：

each内の項目をループするとき、あなたは、必要に応じて代わりに{{@key}}を使用して、オブジェクトの反復処理のために{{@index}}

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

を介して電流ループインデックスを参照することができます。

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

をので、 、あなたが最新のハンドルバーを使用しているなら、thを使って特別なことをすることができます事実：

1. 最初の@indexはゼロになります。
2. ブール値のコンテキストでゼロが偽です。あなたがこれを行うことができます

：

{{#each this}} 
    <input type="radio" value="{{value}}" {{#unless @index}}checked="checked"{{/unless}} /> 
{{/each}} 

デモ：もちろんhttp://jsfiddle.net/ambiguous/PHKps/1/

は、他のインデックスを選び出すことは困難であり、あなたを残しいずれかの入力データを修正する（前など）または追加ある種の{{#if_eq}}カスタムヘルパー。

2番目の引数として渡されます

Answer 2

index 、

<form> 
    {{#each people as |value index|}} 
     <input value="{{value}}" type="radio" {{#unless index}}checked="checked"{{/unless}}/> 
    {{/each}} 
</form>