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

时间:2014-11-04 20:56:08

标签: filter meteor client

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

现在每个帖子都有一个列表名称和正在保存的ID - 我可以提供可用的列表。

我现在需要做的只是一个简单的过滤器,因此用户基本上可以"查看"仅列出给定列表的帖子。

我在哪里 - 如果我可以将选择中的id传递给postlistid - 只是没有想出如何做到这一点。我尝试使用变量并将列表中的事件更改中的值传递给帮助程序,但同样没有完全连接点。

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

由于

1 个答案:

答案 0 :(得分:3)

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

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);
    }
  });
}