流星-从父模板到子模板之间传递数据

Question

I'm trying to create a two-way table with two collections in meteorJS where i could pass the name of one collection from the parent template to child template.

Item is the x-axis and Item2 is the y-axis.

My Collections :

db.Item.insert({
    "name" : "hello",
    "param1" : "ok",
    "param2" : "ok",
    "parma3" : "na"
});

db.Item.insert({
    "name" : "bonjour",
    "param1" : "na",
    "param2" : "ok",
    "parma3" : "ok"
});

db.Item2.insert({
    "id" : "01",
    "nameIt2" : "nameS"
});

db.Item2.insert({
    "id" : "02",
    "nameIt2" : "name"
});

My Code HTML :

 <template name="home">
   <table class="table maintable">
      <!--Entête du tableau (première ligne)-->
      <tbody>
        {{#each event}}
          {{> eventItem}}
        {{/each}}
      </tbody>
   </table>
</template>


<template name="eventItem">
  <tr>
    {{#each event2}}
      {{> eventItem2}}
    {{/each}}
  </tr>
</template>

<template name="eventItem2">
  <td>
    {{nameItem}}
  </td>
</template>

My JS code :

Template.home.helpers({
event() {
    return Item.find();
  },
});

Template.eventItem.helpers({
event2() {
    return Item2.find();
  },
});

Template.eventItem.helpers({
event2() {
    return Item2.find();
  },
});

Template.eventItem2.helpers({
nameItem() {
    return **Name field of my collection Item**
  },
});

Is there a way to pass the Name of each Item from the parent template eventItem to child template eventItem2 ?

Answer 1

Yes, you could use Template.parentData to access the data of parent template:

Template.eventItem2.helpers({
  nameItem() {
    return Template.parentData().name;
  },
});

Answer 2

You just need to set value in you child template in order pass the data.

You can pass data like this:

<template name="home">
   <table class="table maintable">
      <!--Entête du tableau (première ligne)-->
      <tbody>
        {{#each event}}
          {{> eventItem childEvent=this}}
        {{/each}}
      </tbody>
   </table>
</template>


<template name="eventItem">
  <tr>
    {{#each childEvent}}
      {{> eventItem2 nameItem=this}}
    {{/each}}
  </tr>
</template>

<template name="eventItem2">
  <td>
    {{nameItem}}
  </td>
</template>

*Note: This represent the current value in #each