Инструкция Handlebars if с индексом = некоторое значение

Я пытаюсь создать таблицу, которая заполняет каждую ячейку таблицы объектом из файла JSON. Мой руль шаблон просто добавляет данные для каждого объекта. То, что я пытаюсь выполнить, для каждого 5-го элемента создается новая строка, а затем она продолжает заполнять ячейки таблицы до 10-го элемента, а затем создает новую строку и т. д.

Я читал на @index. Есть ли какая-то функция, которая делает что-то вроде {{#if @index / 5 == 0}} ? В противном случае есть что-то руль предлагает, что может достичь функциональности, которую я пытаюсь сделать? Я не ограничиваюсь использованием таблицы, я просто подумал, что это лучший вариант для размещения данных.

мой текущий шаблон. Спасибо за любую помощь! Я отредактировал это ниже, используя помощник handlebars. Но информация все равно не передается. Существует дополнительный код, который компилирует шаблон после окончания этого, но он включает очень длинный массив json в локальный файл для тестирования. 

<script type = "text/x-handlebars-template" id="itemTemplate">
    <table class="tableStyle">
        <tr>
            {{#each all_coupons}}
                {{#ifPos}}
                <tr>
                    <td>    
                        <div class="wrapper">
                            <div class="header">{{coupon_title}}</div>              
                            <div class="column_wrapper">
                                <div class="two-col">
                                          <div class="product_image"><img src="{{coupon_thumb}}" alt="Apple" height="110" width="110"></div>
                                          <div class="description">{{coupon_description}}</div>
                               </div>
                            </div>
                            <div class="expiration">Valid From: {{valid_from}} to {{valid_to}}</div>    
                        </div>
                    </td>
                </tr>
                {{else}}
                    <td>    
                        <div class="wrapper">
                            <div class="header">{{coupon_title}}</div>              
                            <div class="column_wrapper">
                                <div class="two-col">
                                          <div class="product_image"><img src="{{coupon_thumb}}" alt="Apple" height="110" width="110"></div>
                                          <div class="description">{{coupon_description}}</div>
                               </div>
                            </div>
                            <div class="expiration">Valid From: {{valid_from}} to {{valid_to}}</div>    
                        </div>
                    </td>
                {{/ifPos}}
            {{/each}}
        </tr>
    <table>
</script>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/handlebars.js"></script>
<script type="text/javascript" src-"js/handlebars.runtime-v1.3.0.js"></script>

<script type="text/javascript">

Handlebars.registerHelper('ifPos', function (context, options) {
    var pos = false;

    for (var i = 0, j = context.length; i < j; i++) {
        if (context.length/5 == 0) 
        {
            pos = true;
        }
        else {
            pos = false;
        }
    }
    console.log(pos);
    return pos;
});
6
handlebars.js

1 ответов

context.length/5 == 0

не даст вам значение, которое вы хотите каждый 5-й элемент. Поскольку 5/5 равно 1, лучше использовать модуль (%), который дает вам остаток, таким образом, когда он равен 0, вы знаете, что он вошел в него целиком.

также, Когда вы хотите сделать свой собственный, если/else блок ручки бары предоставляет вам варианты.Fn и варианты.обратный. Параметры возврата.fn (//все, что вы хотите передать в блок if) или параметры.обратный (//что когда-либо предоставлять блоку else) от вашего помощника, чтобы перейти к соответствующему часть квартала.

вот кодовое перо показывает быстрый пример того, как вы можете получить позицию индекса элемента, который вы повторяете, и применить стиль на основе этого. Вспомогательные функции перейдут к истинной части блока if, когда индекс % 3 равен 0 (первый, потому что это индекс на основе 0, а затем каждый третий элемент. Все остальное время он будет идти к иначе!--4-->

помощник

Handlebars.registerHelper('ifThird', function (index, options) {
   if(index%3 == 0){
      return options.fn(this);
   } else {
      return options.inverse(this);
   }

});

шаблон

<script id="template" type="text/x-handlebars-template">

      {{#each this}}
      <p class="{{#ifThird @index}}
                  red
                {{else}}
                  blue
                {{/ifThird}}">{{@index}} - {{name}}</p>
      {{/each}}

</script>
12