【问题标题】:Meteor: how do you display a collection in multiple tables, where each table is a group of objects that have the same key value?Meteor:如何在多个表中显示一个集合,其中每个表是一组具有相同键值的对象?
【发布时间】:2013-02-22 05:30:53
【问题描述】:

假设您有一堆博客文章,每个文章都有一个“标题”和“类别”。您将如何在单个页面上呈现所有帖子标题,其中每组具有相同“类别”值的帖子都有一个表格?

我是按类别排序开始的,所以同一类别的帖子在光标中是分组在一起的:

Template.postLists.posts = function() {
  return Posts.find({}, {sort:{category:1}});
}

但我正在努力通过 {{#each}} 在模板中迭代此列表,并使用 Handlebars 检测何时到达新的“类别”,以便我可以开始一个新的,然后结束当我处于类别的末尾时。

我是不是走错路了,还是有一种简单的方法可以做到这一点?

【问题讨论】:

  • 不是返回所有帖子,而是按类别返回?将类别存储在单独的集合中。
  • 每个类别{每个帖子{渲染}}

标签: meteor collections


【解决方案1】:

我采用的解决方案是,在我的模板处理程序中,我没有使用 Posts.find() 返回游标,而是创建了一个 JSON 对象,该对象具有可以由把手模板处理的结构(类别对象数组,其中每个类别都有一个帖子数组):

Template.postLists.categorizedPosts = function() {
    var allPosts = Posts.find({}, {sort:{category:1}}).fetch();

    // Then I iterate over allPosts with a loop, 
    // creating a new array of this structure:
    // for ...
    var catPosts = [ { category:"cat1", posts: [ {post1}, {post2} ] },
                     { category:"cat2", posts: [ {post3}, {post4}, {post5} ] },
                     // etc... 
                   ];
    // end loop
    return catPosts;

模板是这样的(但使用表格而不是 UL,这里只是使用 UL 进行更简洁的演示):

{{#each categorizedPosts}}
  {{category}}  
  <ul> 
    {{#each posts}}
    <li>{{posts.title}}</li>
    {{/each}}
  </ul>
{{/each}}

请注意,当您返回这样的对象(而不是 Posts.find() 返回的游标对象)时,Meteor 的模板引擎将失去智能检测集合中只有一个对象何时发生更改的能力,并修补DOM 而不是完全重新渲染模板。因此在这种情况下,即使在数据库中更新了单个 Posts 对象,模板也会完全重新呈现。这就是缺点。但好处是它有效;)

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-09-18
    • 2014-04-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-12-30
    相关资源
    最近更新 更多