Question

我想使用Handlebars模板在表格中添加一个计数器。我有一个像这样的Handlebars模板：

<script type="text/template" id="user-home-main-table-template">

    <% var i=0 %>
    <table class="table">
        <thead>
        <tr>
            <th>#</th>
            <th>Team Name</th>
            <th>Club</th>
            <th>Sport</th>
            <th>Delete?</th>
        </tr>
        </thead>
        <tbody>
        {{#teams}}
        <tr>
            <td><%=i%></td>
            <td>{{teamName}}</td>
            <td>{{club}}</td>
            <td>{{sport}}</td>
            <td>delete</td>
        </tr>
        {{/teams}}
        </tbody>
    </table>
</script>

这有效，但变量我不会增加，这是解决这个问题的最佳方法吗？

Answer 1

您可以使用{{@index}}访问当前索引

{{#each array}}
  {{@index}}: {{this}}
{{/each}}

但索引将以 0 开头，有时您可能不想要。

在这种情况下，您可以创建并注册辅助方法来增加索引。

Handlebars.registerHelper("inc", function(value, options)
{
    return parseInt(value) + 1;
});

然后，您可以使用inc关键字在车把表达式中使用它，例如：

{{inc @index}}

但如果你不想这样做，还有另一种更简单的方法来实现同样的目标。

{{@index_1}}

试一试。

Answer 2

在Handlebars中，您可以像这样访问当前循环的索引：

{{#each array}}
  {{@index}}: {{this}}
{{/each}}

{{@index}}将评估当前迭代的位置。例如：0,1,2等

您可以在此处找到更多文档：http://handlebarsjs.com/builtin_helpers.html#iteration

希望它有所帮助。

把手模板 - 添加递增变量的最佳方式

2 个答案: