流星模板参数值在助手和事件之间不同

Question

我想包含一个带参数的 Blaze 模板，然后在事件中使用该参数值。问题是，当我第二次使用不同的参数包含模板时，我从事件中模板的第一个实例中获取了参数值。

模板：

<template name="UploadFormLayoutImage">
    <form class="uploadPanel">
        <input type="file" name="fileupload" id="input-field">
        <label for="input-field">Upload file</label>
    </form>
</template>

包括：

{> UploadFormLayoutImage layoutArea="area1"}}
{> UploadFormLayoutImage layoutArea="area2"}}

js:

Template.UploadFormLayoutImage.onCreated(function(){
   this.currentArea = new ReactiveVar;
   this.currentArea.set(this.data.layoutArea);
});


Template.UploadFormLayoutImage.helpers({
    layoutArea: function() {
        return Template.instance().currentArea.get(); //Returns the correct argument value for each instance of the template.
    }
});


Template.UploadFormLayoutImage.events({
    'change input[type="file"]': function(e, instance) {
        e.preventDefault();
        console.log(instance.data.layoutArea); //Allways returns 'area1'
    }
});

我在这里错过了什么？（这是我的第一个 Whosebug 问题。请温柔点:)）

Answer 1

如果将事件方法中的 instance.data.layoutArea 更改为 this.layoutArea 会怎么样？

Answer 2

为了使代码示例易于阅读，我删除了导致问题的部分。我正在为输入字段使用标签，因此输入字段有一个 id，在重复模板时当然不行。

我现在使用 layoutArea-helper 作为 id 值，一切正常。

<template name="UploadFormLayoutImage">
    <form class="uploadPanel">
        <input type="file" name="fileupload" id="{{layoutArea}}">
        <label for="{{layoutArea}}">Upload file</label>
    </form>
</template>

流星模板参数值在助手和事件之间不同

meteor template argument value differs between helper and event

meteor

meteor-blaze