嵌套 {{#each}} 不起作用

Question

我的 JavaScript 中有以下数组：

let food = [
    'taco',
    'burrito',
    'hamburger',
  ]

let drinks = [
    'water',
    'milk',
    'soda',
  ]

我将这些传递给我的 Handlebars 模板，然后我这样做：

{{#each food as |food|}}
  {{food}}
  {{#each drinks as |drink|}}
    {{drink}}
  {{/each}}
{{/each}}

但它只会打印出来

taco burrito hamburger

我希望输出是这样的（为了便于阅读，分成换行符）

taco
water
milk
soda
burrito
water
milk
soda
hamburger
water
milk
soda

它似乎完全忽略了嵌套的 each 循环。这里有什么问题？

Answer 1

这是一个上下文问题。内部each 是在没有定义drinks 的外部的上下文中。

这是一个工作模板的示例；

{{#each food as |food|}}
  {{food}}
  {{#each ../drinks as |drink|}}
    {{drink}}
  {{/each}}
{{/each}}

在这里，我们使用../ 回溯到定义drinks 的父上下文。