分组和显示数据 [英] Group and display data

问题描述

这是我的数据

data = [
  { category : "Cat1"}, 
  { category : "Cat2"}, 
  { category : "Cat3"}, 
  { category : "Cat4"}, 
  { category : "Cat5"}, 
  { category : "Cat6"}]

假设我把它放在一个名为 myData 的集合中

Let suppose i have it in a collection named myData

我想要的是将我的数据分组并显示在 2 组中.然后我像这样在导航栏中显示它(实际上是在下拉列表中)

What i want is to group and display my data in group of 2. Then i display it in a navbar (in a dropdown in fact) like this

<ul>
{{#each group}}
<li class="col-md-2">
  <ul>
   {{#each categories}}   
   <li>{{category}}</li>
   {{/each}}
  </ul>
{{/each}}
<ul>

我要问的是如何在我的助手或 mongodb 中对数据进行分组，以便我可以得到这个结果.

What i am asking is how to group the data in my helpers or in mongodb so that i could get this result.

推荐答案

您可以使用下划线的 map 和 compact

You can break it up into groups of 2 inside a helper using underscore's map and compact

Template.hello.helpers({
  groups() {
    // var data = myData.find().fetch();
    var data = [
      { category : "Cat1"},
      { category : "Cat2"},
      { category : "Cat3"},
      { category : "Cat4"},
      { category : "Cat5"},
      { category : "Cat6"}];

      return _.chain(data).map(function(item, index){
        return (index % 2) ? false : data.slice(index, index + 2);
      }).compact().value();
   },
});

然后，在您的模板中，您可以使用嵌套的 #each in 来遍历组

Then, in your template you can use a nested #each in to loop through groups

<template name="hello">
  <ul>
    {{#each group in groups}}
      <li class="col-md-2">
        <ul>
          {{#each category in group}}
            <li>{{category.category}}</li>
          {{/each}}
        </ul>
      </li>
     {{/each}}
    </ul>
  </template>

这篇关于分组和显示数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！