流星の単純な反応VAR

Question

私は2つのタブ間のメインパネルでコンテンツを切り替えるために反応VARを使用しようとして流星に働いています。私は自分自身でコンテンツをテストすることができたので、問題が反応するvarコードにあると確信しています。具体的には、問題はtab：function（）だと思っていますが、多くの検索とドキュメントの読み込みの後、解決策が見つかりませんでした。

関連JS：

Template.content.onCreated(function() { 
    this.currentTab = new ReactiveVar('form'); 
}); 

Template.content.helpers({ 
    tab: function() { 
     return Template.instance().currentTab.get(); 
    } 
}); 

Template.content.events({ 
    'click .nav li': function (event, template) { 
     var currentTab = $(event.target).closest("li"); 

     currentTab.addClass("active"); 
     $(".nav li").not(currentTab).removeClass("active"); 

     Template.currentTab.set(); 
    } 
}); 

関連のhtml：

<template name ="content"> 
    <ul class ="nav"> 
     <li data-template="form"><a href="#">Form</a></li> 
     <li data-template="results"><a href="#">Results</a></li> 
    </ul> 
    {{ > Template.dynamic template=tab}} 
</template>   

Answer 1

{{ > Template.dynamic template=tab}} 

これは、表示したいテンプレートの名前である文字列を取得するためにtabヘルパーを呼び出していますここに。 currentTabの値を "form"に設定することで、最初から作業する必要があります。

が示されますテンプレートを変更するには、新しいテンプレートの名前と一致する文字列に currentTabの値を変更する必要があります。あなたはそれをしていない。

Template.currentTab.set(); 

ここでこれを行う必要があります。代わりに、あなたは、私が存在するとは思わないTemplateのcurrentTab性質上set()を呼んでいます。 Templateは大文字のTはMeteorオブジェクトであり、あなたが参照しようとしているテンプレートインスタンスではありません。 currentTabの新しい値を設定するには、実際に値を指定する必要があります。これと同じように：

Template.content.events({ 
    'click .nav li': function(event, instance) { 
     //logic to decide which template you want to show 
     //and put the name of that template in templateName 

     instance.currentTab.set(templateName) 
    } 
});