Question

使用Meteor，我试图循环显示数据库中的注释列表，并提供删除每个注释的选项。

这是HTML（使用Handlebars.js）

<template name="Notes">
    {{#each NoteArr}}
        <div class="Note">
            <h2>{{Title}}</h2>
            <p>{{Body}}</p>
            <span class="deleteNote">Delete</span>
        </div>
    {{/each}}
</template>

这是客户端Javascript

Template.Notes.events = {
    "click .deleteNote" : function(){
        noteID = $('.deleteNote').parent().attr("id");
        Notes.remove({ID:noteID});
    }
};

这抓住了.deleteNote的第一个实例，所以除非我试图删除第一个实例，否则这将无济于事。如何获取被单击的.deleteNote特定实例的父项，而不仅仅是它找到的第一个实例？

Answer 1

删除第一个元素的原因是..在.click事件中，您正在直接访问div $('.deleteNote').parent()，它抓取html中具有类{{1}的第一个节点}}

现在从集合中删除特定的.deleteNode：集合中的每个文档都有一个自动生成的唯一notes属性。将文档的唯一_id作为_id分配给span元素。

因此cilck事件将如下所示：

<span id= "{{_id}}" class="deleteNote">Delete</span>

模板看起来像：

 Template.Notes.events = {
    "click .deleteNote" : function(e){
        var noteID = e.currentTarget.id;
        Notes.remove({_id:noteID});
        }
   };

未经测试的代码，但希望这有助于解决您的问题。

Answer 2

音符的_id也存储在'this'中。另外，remove函数接受'_id'作为字符串。所以这也应该有效：

Template.Notes.events = {
  'click .deleteNote': function(){ return Notes.remove(this._id)}
}

这里有一些好处。少查询DOM以获取信息。少jQuery。想想的代码行更少。清洁模板。

Meteor - 选择单击元素的Parent ID

2 个答案: