Значение аргумента шаблона метеора различается между помощником и событием

Я хочу включить шаблон 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'
    }
});

Что мне здесь не хватает? (Это мой первый вопрос о Stackoverflow. Пожалуйста, будьте нежны :))


meteor meteor-blaze
person Michel    schedule 14.09.2016    source источник
comment
пожалуйста, поделитесь шаблоном UploadFormLayoutImage. Вы вызываете помощников с аргументами в этом шаблоне?   -  person Ankit    schedule 14.09.2016
comment
@Ankit Я добавил шаблон. Мне на самом деле не нужен помощник в шаблоне. Мне просто нужно получить то же значение в событии, что и в помощнике. Я буду использовать это значение при создании Mongo-документа. Спасибо за ваш комментарий.   -  person Michel    schedule 14.09.2016

Ответы (2)


arrow_upward
0
arrow_downward

Что, если вы измените instance.data.layoutArea в своем методе обработки событий на this.layoutArea?

person NFab    schedule 14.09.2016
comment
К сожалению, это дает тот же результат. - person Michel; 14.09.2016
comment
Хм. Ну, вы устанавливаете значение экземпляра this в методе событий, и оно присоединяется к input[type="file"], который, кажется, включает первый экземпляр {> UploadFormLayoutImage layoutArea="area1"}}. Чтобы устранить эту проблему, вы можете console.log как e, так и instance в своем методе событий, чтобы увидеть, что приходит. Если он передает данные только из первого экземпляра, вы можете попробовать изменить свой прослушиватель на что-то помимо изменения, например, щелчок, поскольку Я обнаружил, что изменения от браузера к браузеру немного привередливы. - person NFab; 16.09.2016

arrow_upward
0
arrow_downward

Пытаясь сделать пример кода легко читаемым, я удалил ту часть, которая вызвала проблему. Я использую метку для поля ввода, поэтому поле ввода имеет идентификатор, и это, конечно, не нормально при повторении шаблона.

Теперь я использую layoutArea-helper в качестве значения идентификатора, и все работает отлично.

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