HandleBars 限制 {{#each arr}}答案

【问题标题】：HandleBars limit {{#each arr}}HandleBars 限制 {{#each arr}}
【发布时间】：2022-02-03 00:51:39
【问题描述】：

我在 BigCommerce Stencil 中使用 Handlebars，我想知道是否可以限制 {{ #each arr }} 循环产生的项目。

    {{#each categories}}
        <li class="navPages-item category-{{name}} category-{{id}}">
            <a class="navPages-action" href="{{url}}">{{name}}</a>
        </li>
    {{/each}}

这是我的代码。我可以看到这样的解决方案：limit results of each in handlebars.js 但我不知道我是否可以在 Stencil 中以某种方式使用注册助手

寻找类似{{#each categories limit:10}}的东西

【问题讨论】：

标签： handlebars.js bigcommerce

【解决方案1】：

您可以在{{#each}} 中嵌套另一个块助手，以按索引限制数组。例如，如果您想返回前 4 个类别：

{{#each categories}}
    {{#if @index '<' 4}}
        <li class="navPages-item category-{{name}} category-{{id}}">
            <a class="navPages-action" href="{{url}}">{{name}}</a>
        </li>
    {{/if}}
{{/each}}

【讨论】：

它给了我这个错误“错误：#if 只需要一个参数”
如果上面的语法不起作用，请尝试：{{#ifLt @index 4}} 或 {{#lt @index 4}}` 以获得一些较新的 Handlebars

【解决方案2】：

我刚刚对其进行了测试，这在 Iterable 中有效：

{{#each categories}}
    {{#lt @index 4}}
        <li class="navPages-item category-{{name}} category-{{id}}">
            <a class="navPages-action" href="{{url}}">{{name}}</a>
        </li>
    {{/lt}}
{{/each}}

【讨论】：