Подтвердить что ты не робот

Пропустить JavaScript-объект/хэш в Handlebars helper?

Можно ли передать объект/хэш JavaScript в вызов помощника Handlebars? Я хотел бы сделать что-то вроде этого:

<label>Label here</label>
{{#textField {'id':'text_field_1', 'class':'some-class', size:30} }}{{/textField}}
<p>Help text here.</p>

Вот jsFiddle. В настоящее время он вызывает следующую ошибку:

Uncaught Error: Parse error on line 3:
...bel>  {{#textField {'id':'text_field_1'
----------------------^
Expecting 'CLOSE', 'CLOSE_UNESCAPED', 'STRING', 'INTEGER', 'BOOLEAN', 'ID', 'DATA', 'SEP', got 'INVALID' 

В качестве альтернативы я мог бы, вероятно, сделать это и разделить на ',', но я не люблю синтаксис:

{{#textField "'id'='text_field_1','class'='some-class',size=30"}}{{/textField}}

ПРИМЕЧАНИЕ. Я специально НЕ хочу передавать данные/атрибуты (id, класс, размер и т.д.) в метод template() как объект JSON. Я хочу все в шаблоне.

4b9b3361

Ответ 1

решаемая. Я сделал это:

Helper:

Handlebars.registerHelper('textField', function(options) {
    var attributes = [];

    for (var attributeName in options.hash) {
      attributes.push(attributeName + '="' + options.hash[attributeName] + '"');
    }

    return new Handlebars.SafeString('<input type="text" ' + attributes.join(' ') + ' />');
});

И шаблон:

<label>Label here</label>
{{textField id="text_field_1" class="some-class" size="30" data-something="data value"}}
<p>Help text here.</p>

В документации (внизу страницы) вы можете передать переменное количество параметров вспомогательному методу, и они будут доступны в options.hash(предполагая, что "параметры" являются параметром вашего вспомогательного метода). И что также приятно в том, что вы можете использовать именованные параметры, а порядок параметров не имеет значения.

Ответ 2

Я нашел еще один лучший способ передать объекты.

Шаблон:

{{textField dataAttribs='{"text":"Hello", "class": "text-field"}'}}

Помощник:

Handlebars.registerHelper('textField', function(options) {
    var attribs;

    attribs = JSON.parse(options.hash.dataAttribs);
    console.log(attribs.text + " -- " + attribs.class);
    ......
    ........
});

JSFiddle для этого