Метеор: нет контекста для обработчиков событий цикла #each

Question

Я использую цикл #each с неуправляемой локальной коллекцией для генерации последовательности полей ввода для формы. Тем не менее, когда я пытаюсь использовать this._id в обработчике событий он не определен. Фактически, контекст, передаваемый в обработчик событий, предназначен для окна. Любая помощь, чтобы найти, что идет не так и как я должен получить правильный контекст, как this в моем событии обработчик высоко ценится.

Код является:

<h4 class="page-header">Children on this account</h4> 
{{#each children}}
<div id={{_id}} class="form-group col-md-12 child-form-instance">
    <div class="form-group col-sm-5 col-xs-12">
        <input type="text" name="childFirstName" class="form-control" placeholder="Child's First Name">
    </div>

    <div class="form-group col-sm-5 col-xs-10">
        <input type="text" name="childLastName" class="form-control" placeholder="Child's Last Name" value="{{_id}}">
    </div>
    <div class="form-group col-xs-2">
        <button type="button" class="btn btn-danger remove-child" aria-label="remove child">
            <span class="glyphicon glyphicon-trash"></span>
        </button>
    </div>
</div>
{{/each}}
<div class="form-group">
    <input type="button" id="addChild" class="btn btn-success" value="Add child">
</div>

и JS:

var children = new Mongo.Collection(null);

Template.signup.onRendered( () => {
  Modules.client.signupValidateSubmit({
    form: "#signup",
    template: Template.instance()
  });
    children.remove({});
    children.insert({});  //create one empty child

});

Template.signup.events({
    'submit form': ( event ) => event.preventDefault(),
    'click #addChild': () => {
        children.insert({});
        console.log(children.find().fetch());
    },
    'click .remove-child': () => {
        console.log(this);
    }
});

Template.signup.helpers({
    children () {
        return children.find();    
    }
});

Все работает нормально с кнопкой addChild, и _ids правильно назначаются в DOM, но класс remove-child регистрирует window контекст.

Answer 1

Вы используете функции стрелки ES6, которые будут лексически связывать this с родительской областью. Как следствие, вы не получите объем children,

Чтобы решить проблему, просто измените событие шаблона на:

Template.signup.events({
    // ...
    'click .remove-child': function (event, template) {
        console.log(this);
    }
    // ...
});