7

我正在开发一个简单的流星抽认卡应用程序。有一组问题，每个问题都有：文本、正确答案、错误答案。

答案被连接成一个数组并打乱，然后模板列出一个问题和可能的答案。当用户单击答案时，如何从事件中获取 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}}
4

2 回答 2

6

我通常会这样做：

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附加到模板实例的数据上下文，因此实际上这或多或少是您的“父上下文”。

编辑

请注意，新的模板引擎 ieblaze允许我们在模板中使用点表示法，因此不再需要我上面描述的方法并且{{../_id}}完全可以。

于 2013-10-29T09:29:12.033 回答
5

您可以Template.parentData(n)在事件处理程序中访问：http: //docs.meteor.com/#/full/template_parentdata

于 2014-11-17T00:45:43.427 回答