在 Meteor 中创建一个简单的过滤器答案

【问题标题】：Creating a simple filter in Meteor在 Meteor 中创建一个简单的过滤器
【发布时间】：2014-11-07 02:44:09
【问题描述】：

我想根据各种帖子所属的列表过滤一组帖子。我有一个下拉列表，允许用户选择列表，但无法弄清楚如何只显示与该列表关联的帖子。

现在每个帖子都有一个列表名称和 ID，并与它一起保存 - 我能够展示可用的列表。

我现在需要做的只是一个简单的过滤器，这样用户基本上可以“查看”给定列表的帖子。

这就是我所在的位置 - 如果我可以将 select 中的 id 传递到 postlistid - 只是还没有弄清楚如何做到这一点。我尝试使用变量并在传递给帮助程序的列表上的事件更改中获取值，但又没有完全连接点。

    Template.userPostsFiltered.helpers({
      userfilteredposts: function() {
      var currentUser = Meteor.userId();
          return Posts.find({userId: currentUser, postlistid: { $exists : true }}, {}, {sort: {date: -1}},{reactive:true});
     }
});

谢谢

【问题讨论】：

当用户选择列表时，在事件映射中设置一个会话变量。然后在您的 userfilteredposts 助手中使用相同的会话变量。
啊，好的，太棒了，谢谢。我知道我错过了一些超级简单的东西。这是像我这样的菜鸟尝试构建像我第一次出来的东西的危险。
关于设置会话变量的问题。如果我有：并且我想将 postlistid 作为变量传递，那么我是否将其用作会话变量？
好的，所以我设置了会话 ID。当它呈现（我正在使用创建）时，会话变量会被发送。但改变什么都没有发生。它设置了会话变量，但似乎没有重新渲染和过滤帖子。我想如果你通过一个变量并且改变了它会自动重新渲染？
请使用您目前拥有的所有相关代码（模板、助手、事件）更新问题。或者我可以举一个完整的例子，但坦率地说，我避免在这方面花费大量时间，因为你没有任何可接受的答案。

标签： filter meteor client

【解决方案1】：

这是一个完整的工作示例：

posts.html

<head>
  <title>test</title>
</head>

<body>
  {{> userPosts}}
</body>

<template name="userPosts">
  <h2>Post Lists</h2>
  <select>
    {{#each postLists}}
      <option value="{{_id}}">{{name}}</option>
    {{/each}}
  </select>

  <h2>Filtered Posts</h2>
  <ul>
  {{#each filteredPosts}}
    <li>{{name}}</li>
  {{/each}}
  </ul>
</template>

posts.js

Posts = new Mongo.Collection(null);
PostLists = new Mongo.Collection(null);

if (Meteor.isClient) {
  Meteor.startup(function () {
    var pl1 = PostLists.insert({name: 'List 1'});
    var pl2 = PostLists.insert({name: 'List 2'});
    var pl3 = PostLists.insert({name: 'List 3'});

    Posts.insert({postListId: pl1, name: 'A'});
    Posts.insert({postListId: pl1, name: 'B'});

    Posts.insert({postListId: pl2, name: 'C'});
    Posts.insert({postListId: pl2, name: 'D'});

    Posts.insert({postListId: pl3, name: 'E'});
    Posts.insert({postListId: pl3, name: 'F'});
  });

  Template.userPosts.helpers({
    postLists: function () {
      return PostLists.find();
    },

    filteredPosts: function () {
      var postListId = Session.get('selectedPostListId');
      return Posts.find({postListId: postListId});
    }
  });

  Template.userPosts.events({
    'change select': function (e) {
      var postListId = $(e.currentTarget).val();
      Session.set('selectedPostListId', postListId);
    }
  });
}

【讨论】：

谢谢，是的，会话变量完成了我最终为过滤器创建不同模板的工作。但是感谢您发送此信息 - 我看到了一些我可能应该实施的东西。
我很高兴它有帮助。 :) 旁注 - 我强烈推荐 accepting 你的一些答案，以便将来获得更好的回应。