如何在Handlebars的each helper中获取数组长度？

在each helper内部，上下文已经切换为数组的单个元素，直接使用{{array.length}}会因为找不到上层的array变量而失效，你可以通过以下两种方法解决：

方法一：通过上层上下文引用 #

利用Handlebars的路径语法，使用../或@root访问外层上下文的数组：

• 使用../（适用于数组直接在当前上下文的上层）：

{{#each array}}
  {{../array.length}}
{{/each}}

• 使用@root（适用于多层嵌套的复杂上下文，直接引用根级上下文）：

{{#each array}}
  {{@root.array.length}}
{{/each}}

方法二：提前传入数组长度变量 #

在渲染模板时，单独传入数组长度作为数据的一部分：

// 示例：渲染时传入长度变量
const template = Handlebars.compile(yourTemplate);
const html = template({
  array: [1, 2, 3],
  arrayLength: [1, 2, 3].length
});

然后在模板中直接使用：

{{#each array}}
  {{arrayLength}}
{{/each}}

内容的提问来源于stack exchange，提问作者E M