Изменить/обновить переменную в Handlebars JS из родительского контекста внутри цикла

Я видел много примеров того, как получить доступ к переменной, принадлежащей родительскому контексту внутри цикла. Однако мне нужно не только получить доступ к переменной, но и изменить/обновить ее.

Как вы можете видеть ниже, у меня есть собственный помощник, который устанавливает переменную, но когда я пытаюсь изменить эту переменную внутри цикла, это не работает. Есть ли способ заставить его работать?

Взгляните на этот jsFiddle.

Шаблон

{{setVarWithName "test" "hello"}}
{{#each questions}}
    <h3>{{title}}</h3>
    <p>before update: {{../test}}</p>
    {{setVarWithName "test" "goodbye"}}
    <p>after update: {{../test}}</p>
    <hr />
{{/each}}

Handlebars инициализируется помощником

var source = $("#template").html(); 
var template = Handlebars.compile(source); 

var data = {
  "questions": [
     {"title": "Question 1"},
     {"title": "Question 2"}
   ]
}; 

Handlebars.registerHelper('setVarWithName', function (name, value) {
    this[name] = value;
    return '';
});

$('body').append(template(data));

person shrewdbeans    schedule 29.01.2018    source источник


Ответы (1)


Ответ, как это часто бывает в JavaScript, заключается в области видимости. По сути, this внутри вашего помощника setVarWithName не указывает на вашу переменную data при использовании внутри цикла {{#each}}, но указывает на question[@index]. Что тебе необходимо сделать:

var source = $("#template").html(); 
var template = Handlebars.compile(source); 

var data = {
  "questions": [
     {"title": "Question 1"},
     {"title": "Question 2"}
   ]
}; 

Handlebars.registerHelper('setVarWithName', function (name, value) {
    data[name] = value; // changed from this to data
    return '';
});

$('body').append(template(data));

См. мою рабочую скрипку. Я добавил помощника {{s}} для печати отрендеренного this в шаблон для удобочитаемости.

person wscourge    schedule 30.01.2018