嵌套的 {{#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

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

Answer 1

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

这是工作模板的示例；

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

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