过滤集合

Question

我有一个显示所有Stories的页面。我添加了一个过滤器表单，您可以在其中选择priority，然后该页面应仅显示具有该优先级的故事。这是形式：

  <form name="filter_form">
    <select name="prio" class="form-control">
      <option value=1>High</option>
      <option value=2>Medium</option>
      <option value=3>Low</option>
    </select>
    <button type="submit" class="btn btn-default">Filter</button>
  </form>

这是显示所有故事的代码：

  <div class="stories">
    {{#each stories}}
      {{> storyItem}}
    {{/each}}
  </div>

这是表单处理程序：

Template.storiesList.events({
  'submit form': function(e) {
    e.preventDefault();

    var prio = $(e.target).find('[name=prio]').val();
    var stories = Stories.find({prio: prio});
    return stories;
  }
});

我想只是做一个查找查询并返回结果并不容易，因为此刻没有任何反应。我在这里做错了什么？

Answer 1

您需要将stories定义为反应助手。然后，您可以使用Session变量将事件链接到列表：

Template.storiesList.helpers({
  'stories': function() {
    return Stories.find({prio: Session.get('prio')});
  }
});

Template.storiesList.events({
  'submit form': function(e) {
    e.preventDefault();

    var prio = parseInt($(e.target).find('[name=prio]').val());
    Session.set('prio'), prio);
  }
});