Meteor:如何在一个视图或页面上成功显示来自两个或多个 mongo 集合的数据

Question

我有两个名为"theCollection"和"StreamingCollection"的mongo集合，代表两类数据。我想在我的主页上显示来自单独集合的两组数据，在更大的模板"Home"中的两个相应的模板中，称为"红色"和"蓝色"，如下所示。

数据在日志中通过，因此发布和订阅工作正常，当我将我的助手从 template.red.helpers 更改为模板时。Home.helpers，数据显示，但只有一个集合。

如何在一页上成功显示来自两个或多个集合的数据？

下面显示了我的主页，它只有一个模板"主页"，这个模板包含不同集合的两个 #each 列表，红色和蓝色，它们本身就是模板。

<template name="Home">
<section>
    <div>
      <ul>
      {{#each articles}}
        {{> red}}
      {{/each}}
    </ul>
  </div>
     <div>
      <ul>
      {{#each articles}}
        {{> blue}}
      {{/each}}
    </ul>
  </div>
</section>

红色和蓝色模板是这样的

<template name="red">
      <li>
    <div><img src="{{thumbnail}}"></div>
      <div>{{title}}</div>
  </li>
</template>
  <template name="blue">
     <li>
        <div><img src="{{thumbnail}}"></div>
          <div>{{title}}</div>
  </li>
</template>

这些是我的帮手

if (Meteor.isClient) {
  Template.red.helpers({
    articles: function () {
      return theCollection.find({}, {sort: {count:-1}, limit:1});
    }
  });
  Template.blue.helpers({
    articles: function () {
      return StreamingCollection.find({}, {sort: {count:-1}, limit:1});
    }
  });
}

Answer 1

你很接近。home模板中有两个{{#each articles}}，但由于帮助程序是在内部模板上定义的，因此没有用于home articles帮助程序。只需将您的 html 更改为：

<template name="Home">
<section>
  <div>
    {{> red}}
  </div>
  <div>
    {{> blue}}
  </div>   
</section>
</template>
<template name="red">
<ul>
  {{#each articles}}
    <li>
      <div><img src="{{thumbnail}}"></div>
      <div>{{title}}</div>
    </li>
  {{/each}}
</ul>
</template>
<template name="blue">
<ul>
  {{#each articles}}
    <li>
      <div><img src="{{thumbnail}}"></div>
      <div>{{title}}</div>
    </li>
  {{/each}}
</ul>
</template>

这是一个

品味和风格的问题，关于子模板与主模板中的 html。您应该考虑您的模板可在多个父模板中重用。对于{{#each }}循环，您通常需要考虑空列表的情况。