在每个循环中访问Handlebars.js范围之外的变量

Question

我有一个handlebars.js模板,就像这样:

{{externalValue}}

<select name="test">
    {{#each myCollection}}
       <option value="{{id}}">{{title}} {{externalValue}}</option>
    {{/each}}
</select>

这是生成的输出:

myExternalValue

<select name="test">
       <option value="1">First element </option>
       <option value="2">Second element </option>
       <option value="3">Third element </option>
</select>

正如所料,我可以访问每个元素的id和title字段myCollection来生成我的选择.在select之外,我的externalValue变量被正确打印("myExternalValue").

不幸的是,在期权的文本中,externalValue价值从未打印出来.

我的问题是:我怎样才能在循环内访问handlebars.js范围之外的变量？

一如既往,先谢谢.

Answer 1

尝试

<option value="{{id}}">{{title}} {{../externalValue}}</option>

该../路径段引用父模板范围,应该是你想要的.

Answer 2

或者您可以使用如下绝对路径：

<option value="{{id}}">{{title}} {{@root.user.path.to.externalValue}}</option>

Answer 3

我看到了很多 404 链接来获取有关此主题的文档。

我用这个更新了它，它在2020 年 4 月 1 日开始工作：

https://handlebarsjs.com/guide/expressions.html#path-expressions

#with 和 #each 等一些帮助器允许您深入研究嵌套对象。当您在路径中包含 ../ 段时，Handlebars 将变回父上下文。

    {{#each people}}
    {{../prefix}} {{firstname}} 
    {{/each}}

即使在注释上下文中打印名称，它仍然可以返回到主上下文（根对象）以检索前缀。

警告

../ 将解析为的确切值根据调用该块的帮助程序而有所不同。仅当上下文更改时才需要使用 ../。诸如 {{#each}} 之类的助手的子代需要使用 ../，而诸如 {{#if}} 之类的助手的子代则不需要。

{{permalink}}
{{#each comments}}
  {{../permalink}}

  {{#if title}}
    {{../permalink}}
  {{/if}}
{{/each}}

在此示例中，上述所有内容都引用相同的前缀值，即使它们位于不同的块内。此行为是 Handlebars 4 中的新行为，发行说明讨论了先前的行为以及迁移计划。