Хелпер для локальных переменных

Нужен, чтобы записывать результаты вызова других хелперов и использовать их дальше внутри текущего шаблона.

Рассмотрим его работу на двух примерах.

Пример 1

Допустим, пользователь заказал манго, арбуз и дыню. Количество и цены всего заказанного попали в переменные в таком виде:

 {
  "mangoPrice": 300,
  "mangoCount": 5,
  "watermelonPrice": 20,
  "watermelonCount": 30,
  "melonPrice": 50,
  "melonCount": 8
}

Количество заказанных манго записалось в переменную mangoCount, цена — в mangoPrice.

Вес арбуза в кг записался в переменную watermelonCount, цена арбуза за кг — в watermelonPrice.

Вес дыни в кг записался в переменную melonCount, цена дыни за кг — в melonPrice.

Используем хелпер multiply, чтобы умножить количество товара на его цену:

{{multiply mangoCount mangoPrice}}

Сделаем так для всех товаров:

{{multiply watermelonCount watermelonPrice}}
{{multiply melonCount melonPrice}}

Чтобы каждый раз не писать эти вычисления, с помощью хелпера var записываем их в локальные переменные, а потом используем в нескольких местах, где они нужны.

Для манго запишем вычисления в mangoTotal.

Для арбуза — в watermelonTotal.

Для дыни — в melonTotal.

Все вместе будет выглядеть так:

{{#vars}}
{{var "mangoTotal" (multiply mangoCount mangoPrice)}}
{{var "watermelonTotal" (multiply watermelonCount watermelonPrice)}}
{{var "melonTotal" (multiply melonCount melonPrice)}}

Теперь, используя хелпер {{#vars}} с записанными в него данными, можно делать вычисления и не прописывать одни и те же данные каждый раз:

Манго: {{mangoCount}}шт. {{@vars.mangoTotal}} ₽
Арбуз: {{watermelonCount}}кг. {{@vars.watermelonTotal}} ₽
Дыня: {{melonCount}}кг. {{@vars.melonTotal}} ₽

Это особенно удобно, если вычислений много.

Теперь вычислим общую сумму заказанных товаров используя хелпер var, с записанными данными.

{{add (add @vars.mangoTotal@vars.watermelonTotal) @vars.melonTotal}}
{{/vars}}

Переменным можно давать любые имена и записывать в них любые вычисления.

Этот пример можно протестировать в песочнице →

Пример 2

Допустим, пользователь опять заказал манго, арбуз и дыню. Но количество и цены всего заказанного попали в переменные в виде немного другого списка:

{
  {
  "products": [
    {
      "id": "1024",
      "title": "Манго",
      "count": 5,
      "price": 300
    },
    {
      "id": "2048",
      "title": "Арбуз",
      "count": 30,
      "price": 20
    },
    {
      "id": "2048",
      "title": "Дыня",
      "count": 8,
      "price": 50
    }
  ]
}

Рассмотрим поэтапно все действия для вычислений.

Переменные можно использовать только внутри блока {{#vars}}.

1. Запишем с помощью хелпера var в переменную tolal — ноль, т.к туда еще не записалось ни одного товара:

{{var "total" 0}}

2. Перебираем список товаров с помощью хелпера each:

{{#each products}}

С помощью each заходим внутрь списка, чтобы можно было работать с переменными, как с обычными переменными, которые не внутри списка.

Теперь:

  • title — название товара;
  • count — количество;
  • price — цена за единицу.

Внутри each умножим переменную с ценой на переменную с количеством:

{{multiply count price}}

Запишем это в новую переменную subtotal, которую мы создадим с помощью var:

{{var "subtotal" (multiply count price)}}

Теперь в subtotal — результат умножения цены на количество.

3. Выводим нумерованный список товаров с подитогом.

Нумерованный список можно сделать с помощью @index — специальной переменной, в которую записан текущий номер элемента списка.

Так как списки нумеруются от нуля, прибавляем к нему единицу add @index 1.

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

{{@vars.subtotal}}
{{add @index 1}}. {{title}} — {{price}} ₽ / {{count}} шт. — {{@vars.subtotal}} ₽

Где:

  • {{add @index 1}} — выведется как порядковый номер заказа. В данном случае это 1,2,3;
  • {{title}} — выведется как название товара. В нашем примере это манго, арбуз, дыня;
  • {{price}} — цена 1 штуки одной позиции;
  • {{count}} — количество заказанного товара;
  • {{@vars.subtotal}} ₽ — цена за заказанное количество одной позиции товара (количество умноженное на цену).

Хелпер each выполняется для каждой записи в списке, поэтому в результате выведется весь список. В нашем случае, в результате выведется три заказанных товара:

  1. Манго — 300 ₽ / 5 шт. — 1500 ₽
  2. Арбуз — 20 ₽ / 30 шт. — 600 ₽
  3. Дыня — 50 ₽ / 8 шт. — 400 ₽

4. Теперь сложим подитог с общим итогом. Для этого перезапишем переменную total.

Подытог записывается столько раз, сколько элементов в списке. Подытог каждый раз мы записываем в одну и ту же переменную — tolal.

С каждым новым элементом в списке, то есть с новым товаром, в toltal перезаписывается новая сумма, но уже с учетом нового товара. В нашем списке три элемента, поэтому подытог перезаписывается три раза.

Перед закрытием each в total записалась общая сумма покупок, которую можно выводить с помощью {{@vars.total}}. В нашем случае это 2500 ₽.

Итого: {{@vars.total}} ₽ → Итого: 2500 ₽

Не забудем закрыть {{/vars}}.

Протестировать этот пример можно в песочнице →

В начало ↑