流星：スペースバー内の配列の値を動的に設定する方法

Question

私は実際にこれを説明する方法はわかりません...私はそれに配列を持っているコレクションを持っています。 。[0] .imageLinkと[0]を変更していないが、今は関数の値に応じて動的になるようにしたいとします（この場合、関数はviewIndexです）。

動作しますが、ダイナミックではありません。私は仕事だろうと思うだろう何

<h3 class='display-price'>$ {{colors.[0].price}}</h3> 

ませんが：

<h3 class='display-price'>$ {{colors.[(viewIndex)].price}}</h3> 

対応するJSファイル（0を返すん）では：

'viewIndex': function() { 
    console.log(Template.instance().variation.get()); 
    return Template.instance().variation.get(); 
} 

Answer 1

あなたがしようとしていることの1つの方法は、を受け取るcolorPriceヘルパーを定義することです

Template.hello.helpers({ 
    colors() { 
    return [ 
     { price: 1}, 
     { price: 2}, 
     { price: 3} 
    ]; 
    }, 
    viewIndex(){ 
    return 1; 
    }, 
    colorPrice(colors, viewIndex){ 
    return colors[viewIndex].price; 
    } 
}); 

を次に、以下のようにテンプレートにあなたがそれを使用することができます：

<template name="hello"> 
    ${{ colorPrice colors viewIndex }} 
</template> 

Answer 2

だから、私はこれを行うための動的な方法を考えて取得するためにカルマンに感謝、次のようにパラメータとしてとviewIndexより多くのjavascriptを使用して！私の解決策は基本的にはヘルパー関数を呼び出すことによってヘルパーと "this"キーワードを使用して、{{＃item}}内の現在のアイテムのすべての値を "this"に渡していたので、本質的にこれが可能になりました：

variationImage() { 
    return this.colors[Template.instance().variation.get()].imageLink[0]; 
}, 
variationLink() { 
    return this.colors[Template.instance().variation.get()].referralLink; 
}, 
variationPrice() { 
    return this.colors[Template.instance().variation.get()].price; 
} 

そして、私は価格を必要なところ、その時点でこれらの値を取得することは{{variationPriceを}}使用するのと同じくらい簡単だった、など

{{#with item}} 
    <h3 class='display-price'>$ {{variationPrice}}</h3> 
{{/with}} 

そして、ちょうどバリエーションは各項目を働いていた方法についての詳細を追加します（私たちはそれらを掻き取っているので）非常にランダムな数のバリエーションを持っているので、これらのラインに沿って何かをして、そこにいくつのものがあるかを表現し、どのバリエーションを設定する必要がありますEを見て：

（ここで、色である項目の異なった色の変化を含む配列）

{{#each colors}} 
    <option value='{{@index}}'>Variation {{variationIndex @index}}</option> 
{{/each}} 

（ヘルパー関数）

variationIndex(index) { 
    return index+1; 
} 

（変動値を設定するイベント関数）

'change .color-variation-select': function(event, template) { 
    template.variation.set($(event.target).val()); 
},