Meteor 显示隐藏元素流星方式

我的

表中有很多
tr
，当我的页面加载1sttr显示而2ndtr隐藏时，例如：

<table>
  <tr></tr> // shows
  <tr></tr> // hide
  <tr></tr> // shows
  <tr></tr> // hide
  ...
  ...
  etc.
</table>


//显示
//隐藏
//显示
//隐藏
...
...
等

我想要构建的内容：当您单击“显示”tr时，较低的tr（位于下方）也必须显示，当您单击“新建”时，tr必须隐藏（如切换）

问题：当我点击“显示”tr时，所有“隐藏”tr也会显示，不是位于下方的一个

我的代码：

<template name="postJobs">
  <tr class="smallInfo">
    // some code
  </tr>
  {{#if showFullContent}}
  <tr class=" bigInfo">
    // some code
  </tr>
  {{/if}}
</template>


Template.postJobs.helpers({
  showFullContent:function(){
    return Session.get('showContent');
   }
});

Template.postJobs.events({
  'click .smallInfo':function(){
    Session.set('showContent',true);
  },
  'click .bigInfo':function(){
    Session.set('showContent',false);
  },
});


//一些代码
{{#如果显示内容}
//一些代码
{{/if}
Template.postJobs.helpers({
showFullContent:function（）{
return Session.get（'showContent'）；
}
});
Template.postJobs.events({
'click.smallInfo'：函数（）{
Session.set（'showContent'，true）；
},
'click.bigInfo'：函数（）{
Session.set（'showContent'，false）；
},
});

我不想使用jQuery
当前代码的问题是您使用的是
Session
，这是一个全局反应式字典，意味着您只能为所有表行存储一个状态

下面是一个使用模板作用域
ReactiveVar
对象的解决方案：

HTML

Saimemount的答案看起来像你想要的。有关更多信息，请参阅。如果您尚未按照
<template name="jobsTable">
  <table>
    {{#each jobs}}
      {{> postJobs}}
    {{/each}}
  </table>
</template>

<template name="postJobs">
  <tr class="smallInfo">
    // some code
  </tr>
  {{#if showFullContent}}
    <tr class=" bigInfo">
      // some code
    </tr>
  {{/if}}
</template>

Template.postJobs.onCreated(function(){
  this.showFullContent = new ReactiveVar(false);
});

Template.postJobs.helpers({
  showFullContent: function(){
    return Template.instance().showFullContent.get();
  }
});

Template.postJobs.events({
  "click .smallInfo": function(event, template){
    template.showFullContent.set(true);
  },
  "click .bigInfo": function(event, template){
    template.showFullContent.set(false);
  }
});