Javascript 流星：如何取回；{{this}}-value"；使用模板事件

注意：整个代码可在此处找到：

问题：我无法用事件检索{{this}}值。Console.log（）正在打印0

我的HTML：

<!-- Modal to control who can collaborate on a course-->

<template name="modalAddCollaborators">
  <div id="modalAddCollaborators" class="modal fade" role="dialog">
    <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Manage Your Collaborators</h4>
      </div>
      <div class="modal-body">
        <form class="form" role="form">
          <ul class="list-group">
            {{#each  addedCollaborators}}
              {{#each canEditCourse}}
                 <li class="list-group-item js-listed-collaborator">{{this}}<a title="Remove Collaborator" id="remove-collaborator" class="btn btn-danger pull-right" href="#"><i class="fa fa-trash"></i></a></li>
             {{/each}}
            {{/each}}
          </ul>
          <div class="form-group">
            <input class="form-control typeahead" type="text" id="collaboratorName" placeholder="add a collaborator  ..." data-source="courses" autocomplete="off" spellcheck="off">
            <button type="button" id="js-addCollaborator" class="btn btn-success">Add</button>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
</template>

我的MongoDB JSON：

{
    "_id" : "j7A3tFdFBn5ECQGwe",
    "title" : "Beatles",
    "coverImageId" : "RERiadyMx8j8C9QQi",
    "author" : "John",
    "keywords" : [ 
        "Paul"
    ],
    "published" : "true",
    "about" : "Testing the Course",
    "canEditCourse" : [ 
        "uo8SMdNroPGnxMoRg", 
        "FLhFJEczF4ak7CxqN", 
        "lkahdakjshdal", 
        "asödjaöslkdjalsöSA"
    ],
    "createdById" : "uo8SMdNroPGnxMoRg",
    "dateCreated" : ISODate("2015-12-28T16:30:34.714Z")
}

---

如JS文件所示，我的最终目标是从数组中删除单击的用户。

因为您已将事件处理程序附加到

modalAddCollaborators

模板

这将是该模板的数据上下文，而该模板没有任何内容

只需在您想要捕获事件的级别设置一个嵌套模板

此外，使用此模式，您可以直接识别协作者的
\u id
，它将是
此
。然而，课程id来自父级模板的上下文。（但我不确定课程级别的数据上下文是高1级还是高2级）

html:

{{#each canEditCourse}}
  {{> nestedTemplate }}
{{/each}}

<template name="nestedTemplate">
  <li class="list-group-item js-listed-collaborator">
    {{this}}<a title="Remove Collaborator" id="remove-collaborator" class="btn btn-danger pull-right" href="#"><i class="fa fa-trash"></i></a>
  </li>
</template>

Template.nestedTemplate.events({
  'click #remove-collaborator': function (event) {
    Courses.update({_id: Template.parentData()._id },{$pull: {canEditCourse: this}});
  }
});

要在子链接单击事件中获取
li
项的文本，请结合使用和（因为不能对列表项使用）：

注意，您可以在事件冒泡阶段通过使用当前DOM元素来引用启动事件的元素。由于元素是锚定标记，因此可以将
li
项作为
它的，然后使用获取其值

至于更新，请使用获取父级
\u id
。在表示要查看的当前数据上下文级别的方法中指定参数
0

例如，
Template.parentData（0）
相当于
Template.currentData（）
<代码>模板。parentData（2）

相当于模板中的

{../.}

。

结果是相同的：0:（哦，我明白了，

canEditCourse

是一个字符串数组，而不是对象。没有

这个。_id

在数据上下文中只有

这个

（没有键）。我将更改代码。现在我得到以下结果：meteor.js:864:模拟调用“/courses/update”的效果时出现异常错误：documentMatches需要一个文档（…）错误：documentMatches需要一个文档发生了一些非常奇怪的情况：console.log（listedCollaborator）打印一些值，而其他值只是空的（甚至不是0）。在我的例子中，四个中的两个通常显示在控制台中。但是，它们都仍然在canEditCourse数组中，因此没有一个被删除。我在问题中添加了JSON。希望它能有所帮助。

console.log（event.target）；

和

console.log（$（event.target.parent（））；

print？$（event.currentTarget.parent（））.text（）；已修复。：）但是，Courses.update不会删除该用户。非常感谢。Template.parentData（0）。\u id有效：）console.log（JSON.stringify（Template.parentData（1））打印“无法读取null的属性”\u id”；而此。\u id只是“未定义”你知道为什么吗？无论如何，我接受了你的回答。你是我的英雄！连续两次帮我摆脱困境。@AmirrahbaranNice，早些时候犯了一个错误；将

{{each}

块的嵌套作为当前数据上下文级别的基础。您是对的

Template.parentData（0）。\u id

应该提供所需的上下文；我更新了我的答案以反映这一点。谢谢

Template.nestedTemplate.events({
  'click #remove-collaborator': function (event) {
    Courses.update({_id: Template.parentData()._id },{$pull: {canEditCourse: this}});
  }
});

'click #remove-collaborator': function (event) {
    console.log(event.target);
    var listedCollaborator = $(event.currentTarget).parent().text();
    console.log(listedCollaborator);
    console.log(JSON.stringify(Template.parentData(0)));
    Courses.update(
        { 
            _id: Template.parentData(0)._id, /* or _id: Template.currentData()._id, */
            canEditCourse: listedCollaborator 
        }, 
        { $pull: { canEditCourse: listedCollaborator } }
    );
}