流星空格键 - {{#each}} 参数

Question

这是我的代码：

HTML

卡片 1：

<!-- Shopping list -->
<div id='shopping' class='card'>
  {{#each task}}
  <ul class="card__task">
    <li>{{taskText}}</li>
    <i class="fa fa-minus delete-task"></i>
  </ul>
  {{/each}}
</div>

卡片 2：

<!-- Medicine list -->
<div id='medicine' class='card'>
  {{#each task}}
  <ul class="card__task">
    <li>{{taskText}}</li>
    <i class="fa fa-minus delete-task"></i>
  </ul>
  {{/each}}
</div>

template.helper

  task: function() {
    return Tasks.find({}, {
      sort: {
        createdAt: -1
      }
    });
  }

任务集合示例

示例 1:

   ...
  "taskGroup": "medicine",
  "taskText": "medicine task 1",
   ...

示例 2:

   ...
  "taskGroup": "shopping",
  "taskText": "shopping task 1",
   ...

所以，我得到了一个集合，其中存储了 taskGroup 对应于 textarea input id 的任务。现在 each 遍历我 tasks collection 中的每个任务，而那两张卡片显示了所有任务。

问题：

如何告诉 each 块只迭代 taskGroup 等于这张卡片 id 的任务？

类似于：

  task: function() {
    return Tasks.find({
    taskGroup: *the card where each block is located*.getAttribute("id");
    }, {
      sort: {
        createdAt: -1
      }
    });
  }

Answer 1

您可以创建一个 blaze 助手来按任务组进行过滤

tasks: function(taskGroup) {
return Tasks.find({
taskGroup: taskGroup;
}, {
  sort: {
    createdAt: -1
  }
});

}

这样你就可以像这样在模板上调用它

{{#each tasks 'medicine'}}
...
{{/each}}

流星空格键 - {{#each}} 参数

Meteor Spacebars - {{#each}} params

handlebars.js

meteor

spacebars