meteor - 如何在事件的 Meteor 中获取父数据上下文

Question

我正在开发一个简单的 meteor 抽认卡应用程序。有一系列问题，每个问题包括:文本、正确答案、错误答案。

答案被连接到一个数组中并被打乱，然后模板会列出一个问题和可能的答案。当用户单击答案时，如何从事件中获取 JS 中的父数据上下文。

就像是:

<button type="button" question="{{../_id}}" class="btn btn-default answer">
{{this}} {{#with ../this}}{{this._id}}{{/with}}
</button>

可以在模板中显示父问题 ID，但我该如何正确执行此操作。目标是拥有一个函数来获取事件并将答案与“right_answer”进行比较以确保相等，并在它有效时给你一个分数。谢谢!

最终想出了这个解决方案，但我不太喜欢它或认为它是正确的:

{{each}}
    {{#with ../this}}
        <button type="button" question="{{../_id}}" class="btn btn-default answer">X</span></button>     
    {{/with}}
    {{this}}
{{/each}}

Answer 1

我通常做这样的事情:

Template.myTemplate.answers = function () {
    var self = this;
    // assume that this.answers is a list of possible answers
    return _.map(this.answers, function (answer) {
         return _.extend(answer, {
             questionId: self._id,
         });
    });
}

然后你就可以开始了，在你的模板中你可以做这样的事情:

<template name="myTemplate">
    {{#each answers}}
        <button data-question="questionId">...</button>
    {{/each}}
</template>

顺便说一句:请注意，使用 question html 上的属性元素根据标准不正确。您应该始终使用 data- 作为自定义标签的前缀.

另请注意，如果您将事件附加到您的模板，如下所示:

Template.myTemplate.events({
   'click button': function (event, template) {
       // ...
   },
});

然后在事件回调中您可以访问 this ，表示 button 所在的上下文元素被渲染，以及 template.data这是附加到您的模板实例的数据上下文，因此实际上这或多或少是您的“父上下文”。

编辑

请注意，新的模板引擎，即 blaze , 允许我们在模板中使用点表示法，因此不再需要我上面描述的方法和 {{../_id}}完全没问题。