Handlebars.js: Могу ли я использовать несколько помощников в одном теге?

Я бы подумал, что должен быть способ вкладывать выражения, например: {{headerText {{getTitle "my_page"}}}} .

В настоящее время это не поддерживается, и я не планирую его поддерживать.

Однако теоретически вы можете создать помощника, который намеренно потребляет и связывает другие помощники:

{{chain "helper1" "helper2" text}}

Если кому интересно, я создал такого помощника:

Handlebars.registerHelper('chain', function () {
    var helpers = [], value;
    $.each(arguments, function (i, arg) {
        if (Handlebars.helpers[arg]) {
            helpers.push(Handlebars.helpers[arg]);
        } else {
            value = arg;
            $.each(helpers, function (j, helper) {
                value = helper(value, arguments[i + 1]);
            });
            return false;
        }
    });
    return value;
});

Работает так:

{{chain "taxAdd" "formatPrice" this.product.price}}

@Znarkus, который вводит зависимость от jQuery

@jrajan Я использовал только jQuery.each , не стесняйтесь переписывать его в соответствии с вашими предпочтениями.

Если кого-то интересует версия, не зависящая от jQuery:

Handlebars.registerHelper('chain', function() {
  var helpers = [];
  var args = Array.prototype.slice.call(arguments);
  var argsLength = args.length;
  var index;
  var arg;

  for (index = 0, arg = args[index];
       index < argsLength;
       arg = args[++index]) {
    if (Handlebars.helpers[arg]) {
      helpers.push(Handlebars.helpers[arg]);
    } else {
      args = args.slice(index);
      break;
    }
  }

  while (helpers.length) {
    args = [helpers.pop().apply(Handlebars.helpers, args)];
  }

  return args.shift();
});

Стоит отметить одну проблему с обеими реализациями: если какой-либо из аргументов задуман как значения, которые должны быть переданы помощнику, но также может быть (принудительно) строками, которые соответствуют имени существующего помощника, будут неожиданные результаты.

Вот две реализации. Оба они позволяют отправлять каждому помощнику несколько аргументов, в отличие от предыдущих примеров.
Они также написаны кофейным шрифтом и зависят от подчеркивания или lodash.

Первый позволяет сделать что-то вроде этого:
{{{chain 'join-strings' 'link-twitter-handles' '@' twitterUsername}}}
Но что-то вроде этого дало бы неожиданный результат:
{{{chain 'join-strings' 'link-twitter-handles' '@' 'join-strings' twitterUsername}}}

Handlebars.registerHelper 'chain', ->
    # Get rid of the options hash
    args = Array.prototype.slice.call arguments, 0, -1
    helpers = []
    argsForHelpers = null
    value = undefined

    _.each args, (arg, i) ->
        if Handlebars.helpers[arg]
            helpers.push Handlebars.helpers[arg]
        else if not value # Only call the helpers once
            value = arg
            unless argsForHelpers
                argsForHelpers = args[i+1..-1]
                argsForHelpers.unshift value
            _.each helpers, (helper) ->
                argsForHelpers[0] = value
                value = helper.apply null, argsForHelpers

    value

Во втором примере есть разделитель, который позволяет chain отделять помощники от аргументов.
Помощник будет предполагать, что каждый аргумент перед разделителем является вспомогательным, а все остальные должны быть переданы как аргументы помощникам.

Handlebars.registerHelper 'chain', ->
    # Get rid of the options hash
    args = Array.prototype.slice.call arguments, 0, -1
    helpers = []

    for arg,i in args
        if arg is '--'
            argsForHelpers = args.slice i + 1
            value = argsForHelpers[0]
            break
        else
            helpers.push Handlebars.helpers[arg]

    _.each helpers, (helper) ->
        argsForHelpers[0] = value
        value = helper.apply null, argsForHelpers

    value

Учитывая этот шаблон:
{{{chain 'join-strings' 'link-twitter-handles' '@' 'join-strings' twitterUsername}}}
и этот объект:
{twitterUsername: 'abc'}
Мы могли ожидать такой скомпилированный шаблон:
<a href="https://twitter.com/join-stringsabc">@join-stringsabc</a>

Я взял реализацию @cdata и превратил ее в версию для помощников блоков. Я также требую, чтобы имена помощников начинались с префикса "!!" чтобы избежать проблемы сопоставления аргументов с именами помощников.

/**
 * Takes an arbitrary number of arguments, the first of which is the operation type 'AND' or 'OR'.
 * Following that will be a list of block helper names prefixed by '!!'.
 * Calls each block helper with the remaining arguments.
 *
 * <strong i="7">@returns</strong> {string}  returns options.fn(this) or options.inverse(this) depending on result of each helper and operation type
 */
Handlebars.registerHelper('chainBlockHelpers', function() {
    var index, arg, helperResult, pass,
        helpers = [],
        args = Array.prototype.slice.call(arguments),
        argsLength = args.length,
        options = args[argsLength-1],
        operation = args.shift(),
        passVal = options.fn(this),
        failVal = options.inverse(this);

    if (operation !== 'AND' && operation !== 'OR')
        throw new Error ('chainBlockHelpers only supports "AND" or "OR" operations.')

    for (index = 0, arg = args[index]; index < argsLength; arg = args[++index]) {
        if (typeof arg == 'string' && arg.startsWith('!!') && Handlebars.helpers[arg.substr(2)]) {
            helpers.push(Handlebars.helpers[arg.substr(2)]);
        } else {
            args = args.slice(index);
            break;
        }
    }

    if (operation === 'AND') {
        pass = true;
        while (helpers.length) {
            helperResult = helpers.pop().apply(Handlebars.helpers, args);
            if (helperResult == failVal) {
                pass = false;
                break;
            }
        }
    } else {
        pass = false;
        while (helpers.length) {
            helperResult = helpers.pop().apply(Handlebars.helpers, args);
            if (helperResult == passVal) {
                pass = true;
                break;
            }
        }
    }

    return pass ? passVal : failVal;
});

похоже, у этого есть встроенная поддержка, используя что-то вроде:

{{ helper1 (helper2 text) }}

В некоторых случаях вы можете заставить своих помощников работать следующим образом:

{{#helper1}}{{helper2}}content{{/helper2}}{{/helper1}}

@Znarkus Используя ваш метод, когда я

    Handlebars.registerHelper('shortNumber', function (value) {
        //return new Handlebars.SafeString(iSpot.number.shortNumber(value)); // Breaks
        return iSpot.number.shortNumber(value);  // Works
    });
    Handlebars.registerHelper('asDollars', function (value) {
        //return new Handlebars.SafeString(iSpot.number.asDollars(value)); // Breaks
        return iSpot.number.asDollars(value); // Works
    });

+1 подход @amwmedia - {{pluralize (titleize (humanize schema.name))}}

+1 похоже на хороший чистый синтаксис.

+1 @amwmedia Работает отлично, спасибо

Подход @breandr / @amwmedia работает как прелесть, но только без Handlebars.SafeString() как @cssagogo, упомянутого выше.

Так ты можешь сделать что-л. как:

{{> partial text=(concat value (default extension 'PDF')) }}

Благодарность

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

Я храню все свои вспомогательные функции в отдельном файле. Поскольку все они находятся в одном месте, я могу передать значение одному помощнику, а затем просто вызвать любые другие функции, которые есть в файле моей вспомогательной функции. Так:

{{ function1 value }}

вспомогательный файл

function2 (value) {
   // code
}

function1 (value) {
   // code
   function2(value)
   // code
   return value;
}

Конечно, это простой способ использовать столько функций, сколько вы хотите. Вы даже можете назначить базовую функцию, которая будет действовать как ваша «цепочка».

{{ chainer value }}

вспомогательный файл

function1 (value) {
   // code
}
function2 (value) {
   // code
}
function3 (value) {
   // code
}
function4 (value) {
   // code
}

function chainer(value) {
   function1(value)
   function2(value)
   function3(value)
   function4(value)
   return value;
}

Сам я этого не делал, но не понимаю, почему это не сработает.

Примечание. Вам нужно только зарегистрировать функции, которые вы хотите использовать в своем html-файле, в качестве помощников по управлению. Я лично зарегистрировал все свои, потому что я использую их независимо друг от друга, но вам не нужно этого делать, если вы не предвидите, что вам нужно использовать их напрямую.

Возврат к процедурному программированию :)