单击 Meteor 中的复选框时返回不同的数据子集答案

【问题标题】：Return different subset of data when clicking checkbox in Meteor单击 Meteor 中的复选框时返回不同的数据子集
【发布时间】：2016-02-01 14:51:55
【问题描述】：

我正在尝试制作 Meteor 网站上给出的简单待办事项应用程序。

这是我的代码或在 Meteorpad 上查看完整的应用程序：

<body>
  <div class="container">
    <header>
      <h1>Todo List</h1>

      <label class="hide-completed">
        <input type="checkbox" checked="{{hideCompleted}}" />
        Hide Completed Tasks
      </label>

      <form class="new-task">
        <input type="text" name="text" placeholder="Type to add new tasks" />
      </form>

    </header>

    <ul>
      {{#each tasks}}
        {{> task}}
      {{/each}}
    </ul>
  </div>
</body>

 Template.body.helpers({
     tasks: function() {
         if (Session.get("hideCompleted")) {
             // If hide completed is checked, filter tasks
             return Tasks.find({
                 checked: {
                     $ne: true
                 }
             }, {
                 sort: {
                     createdAt: -1
                 }
             });
         } else {
             // Otherwise, return all of the tasks
             return Tasks.find({}, {
                 sort: {
                     createdAt: -1
                 }
             });
         }
     },
     hideCompleted: function() {
         return Session.get("hideCompleted");
     }
 });

hideCompleted 复选框没有从列表中省略选中的项目，经过数小时的努力，我仍然找不到错误。有人可以帮我吗？

【问题讨论】：

标签： javascript mongodb meteor meteor-helper

【解决方案1】：

您应该使用Session.equals(key, value) 来测试会话变量是否等于某个值。

你的情况是：

 Template.body.helpers({
    tasks: function(){
        return Session.equals("hideCompleted", true) ? Tasks.find({checked: {$ne: true}}, {sort: {createdAt: -1}}) : Tasks.find({}, {sort: {createdAt: -1}});
    }
  });

另外，你需要注册一个click event来反转对应的Session值：

 Template.body.events({
    "click #hide-tasks": function(e) {
        e.preventDefault();
        Session.set("hideCompleted", !Session.get("hideCompleted"));
    }
 });

<input id="hide-tasks" type="checkbox" checked="{{hideCompleted}}" />

这是更新后的MeteorPad。

【讨论】：