流星删除特定文档的每个占位符

Meteor each placeholder for deleting specific document

如何在空格键 {{#each}} 中为刚刚删除的文档设置会话变量?我想通知用户他们刚刚删除了一些内容,消息将代替同一个文档。

例如:

{{#each list}}
   <span>{{number}}</span>
{{/each}}

将编译为:

<span>1</span>
<span>2</span>
<span>3</span>

如果我要从集合中删除第二个文档 {number: 2},那么模板将按预期对更改做出相应的反应:

<span>1</span>
<span>3</span>

相反,我希望它在 Mongo 删除语句之后显示以下内容:

<span>1</span>
<span>You have deleted 2</span>
<span>3</span>

您可以通过使用 _uihooks 在每次删除元素时插入一个占位符元素来完成此操作。我创建了一个 meteor pad with an example.

client.js

Template.body.events({
  "click #add-item": function() {
    Items.insert({name: "Item"});
  },
  "click .delete": function() {
    Items.remove({_id: this._id});
  }
});

Template.body.helpers({
  items: function() {
    return Items.find({});
  }
});

Template.body.rendered = function() {
  Meteor.defer(function(){
    document.getElementById("items")._uihooks = {
      removeElement: function(node) {
        var placeholder = document.createElement("li");
        $(placeholder).html("Placeholder");
        $(placeholder).insertBefore(node);
        $(node).remove();
      }
    }
  });
}

main.html

<body>
<ul id="items">
{{#each items}}
  <li>
    {{name}}
    <button class="delete">delete</button>
  </li>
{{/each}}
</ul>
<button id="add-item">Add item</button>
</body>