Условный IF в handlebar.js - PullRequest
Новая
       9

Условный IF в handlebar.js

1 голос
/ 17 октября 2019

У меня есть динамическая таблица, где данные выбираются с помощью Handlebar.js. Как убедиться, что таблица имеет максимум 3 столбца в любой момент времени? Я новичок в руле и не могу понять, как использовать условие «==» или «> =» в руле для проверкиномер столбца для каждой динамически создаваемой таблицы. Если количество столбцов больше 3;я хочу начать с нового ряда.

Пожалуйста, предложите, как поступить с этим! вся помощь приветствуется 

  <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.min.js"></script>
  
  Handlebars.registerHelper('if_eq', function(a) {
        if (a >= 3) {
            return true;
        } else {
            return false;
        }
    });
 {{#each categories}}
    <table style="border:1px solid black;" id="catlist">
        <thead>
        <tr>
            <td class="tblHead" colspan='100%'> <a href="{{url}}">{{name}}</a></td>
        </tr>
        </thead>
        <tr>
            {{#each children}}
            <td style="vertical-align:top">
               {{#if children}}
                <a href="{{url}}"> <span class="heading">{{name}} </span></a>
                    <ul>
                        {{#each children}}
                            <a  href="{{url}}"><li>{{name}}</li></a>
                        {{/each}}
                    </ul>
                {{/if}}
            </td>
            {{/each}}
        </tr>
    </table>
    <br>
    {{/each}}

1 Ответ

0 голосов
/ 17 октября 2019

Зарегистрируйте помощника для ваших нужд, например. Я создаю ifNewRowNeeded, который принимает два аргумента first - это счетчик циклов, а second - это когда нужно ломать 

Handlebars.registerHelper('ifNewRowNeeded', function(v1, v2, options) {
  if (v1 % v2 == 0) { // will help you creating `tr` on indexes 0, 3, 6, 9 ....
    return options.fn(this);
  }
  return options.inverse(this);
});

Теперь, итерируя, просто вызовите помощника, который вычислит это для вас. Как это 

{{#each children}}
    {{#ifNewRowNeeded @index 3}}
         <tr>
    {{/ifNewRowNeeded}}

     <td>Hello Test</td>

    {{#ifNewRowNeeded @index 3}}
         </tr>
    {{/ifNewRowNeeded}}
{{/each}}
...