Question

在mongodb中，我有json值，并且没有修复。有时候它只会是2或3，有时它会非常大。

  {"_id" : "p83oZAo7fdhNuDD34",
"Active Template Name" : "Windows Mobile",
"ProductId" : "456",
"Subcategory" : "on",
"Size" : "on",
"Material" : "A",
"Price" : "2345",
"Combo Id" : "67u",
"Color" : "red",
"Status" : "Pending"
},
{
  "_id" : "p83oZAo7fdhNuDD34",
"Material" : "A",
"Price" : "2345",
"Combo Id" : "67u",
"Color" : "red",
"Status" : "Pending"
}

我想在tbody中显示所有键，如（id，活动模板名称，ProductID .......）作为表头和值（p83oZAo7fdhNuDD34，Windows Mobile，456 .......）。 / p>

我没有得到在流星中执行此操作的确切方法。我的收藏品名称是产品，Html代码如下。

    <template name="productvalue">
     <table>

     </table>
    </template>

Answer 1

使用{{#each}}块帮助程序迭代您的收集产品。

<template name="productvalue">
  <table>
    <thead>
      <th>Id</th>
      <th>Active Template Name</th>
      <th>ProductId</th>
      [...]
    </thead>
    <tbody>
      {{#each products}}
        <tr>
          <td>{{_id}}</td>
          <td>{{activeTemplateName}}</td>
          <td>{{ProductId}}</td>
          [...]
        </tr>
      {{/each}}
    </tbody>
  </table>
</template>

您还需要定义帮助程序以重命名包含无效Spacebars字符的有问题的密钥。

Template.productvalue.helpers({
  products: function(){
    return Products.find();
  },
  activeTemplateName: function(){
    return this["Active Template Name"];
  },
  [...]
});

Answer 2

如果要在标题中显示包含所有可能属性的表，并且每行填充的每行都是否填充了该行中的文档是否已定义属性，则需要：

提前（在onCreated或onRendered中），找到数据集的所有可能的属性，对它们进行排序，并将它们存储在“标题”对象中，你的助手。（在Session中或使用reactive variable）如果需要，使用this.autorun()使其成为被动的。
然后，执行与上面相同的操作，只是返回tableHeader
对于rowContent，迭代存储的标头并为当前文档中的每个未定义字段填充一个空字符串数组

示例：

function getHeader(products) {
  var header = {};
  for (var key in products) {
    for (var property in products[key]) {
        header[property] = true;
    }
  }
  return Object.keys(header);
}

Template.productvalue.onRendered(function () {
  var products = Products.find().fetch();
  Session.set('header', getHeader(products));
  this.autorun(function () {
    var products = Products.find().fetch();
    Session.set('header', getHeader(products));
  });
});

Template.productvalue.helpers({
  'tableHeader': function () {
    return Session.get('header');
  },
  'rowContent': function (document) {
    var row = [];
    var header = Session.get('header');
    for (var key in header) {
      row.push(document[header[key]] || "");
    }
    return row;
  }
});

在模板中：

<template name="productvalue">
 <table>
  <thead>
   {{#each tableHeader}}
    <th>{{this}}</th>
   {{/each}}
  </thead>
  <tbody>
   {{#each products}}
    <tr>
     {{#each rowContent this}}
      <td>{{this}}</td>
     {{/each}}
    </tr>
   {{/each}}
  </tbody>
 </table>
</template>

我仍然建议使用using a reactive variable代替Session，但演示内容非常复杂。

使用meteor和mongo db在表中显示键值对

2 个答案: