Handlebars技术问题：如何在{{with}}块中获取当前上下文的键？

问题本质 #

Handlebars的{{#with}}助手仅负责切换当前上下文到指定的值，不会自动暴露该值对应的对象键名。你尝试的{{@key}}仅在{{#each}}遍历对象的场景下生效，而../@key报错是因为上层上下文根本不存在@key变量。

适配你需求的解决方案 #

如果需要同时获取键名并遍历对应数组，分两种场景处理：

场景1：明确指定单个键名（如示例中的"My Key"）

先将键名存为临时变量，再传入{{#with}}块使用：

{{!-- 用let助手临时存储键名（需Handlebars 4.3.0+，或自行注册类似助手） --}}
{{#let "My Key" as |targetKey|}}
  {{#with myData.[targetKey]}}
    键名：{{targetKey}}
    数组内容：{{#each .}}{{this}}{{/each}}
  {{/with}}
{{/let}}

若你的Handlebars版本不支持let，可通过嵌套上下文传递：

{{#with myData.[My Key] as |arrayData|}}
  键名：My Key
  数组内容：{{#each arrayData}}{{this}}{{/each}}
{{/with}}

场景2：遍历myData下所有键值对（更贴合你"遍历数组"的需求）

直接用{{#each}}遍历myData，此时{{@key}}会自动获取当前遍历的键名，this就是对应的数组：

{{#each myData}}
  当前键名：{{@key}}
  数组内容：{{#each .}}{{this}}{{/each}}
{{/each}}

这种方式无需硬编码键名，能自动处理myData中的所有键值对，完全满足遍历需求。

原方法无效的原因 #

• {{#with}}的设计目标是切换上下文，而非遍历对象，因此不会生成@key变量。
• ../@key尝试访问上层上下文的@key，但你的上层上下文是根对象，不存在该变量，所以触发报错。

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