使用 JSON 定义 Handlebars JS 部分：在 JSON 中定义部分的名称并让 Handlebars JS 呈现该部分

Question

我们正在使用 config.json 来设置基于 Handlebars 的布局，以从模板生成电子邮件。此 json 配置包括部分名称和该部分的内容（图像、标题和描述）。

/partials/.. 被称为：

• primary.html
• secondary.html

这是 /data/config.json 的示例 - 您可以看到“模块”节点包含部分及其内容：

{
    "subject": "my email subject",
    "pretext": "this is the pretext text",
    "modules": {
        "primary":{
            "image": {
                "src": "primary-hero.jpg",
                "alt": "This is the primary image"
            },
            "headline": "Primary Headline",
            "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate nulla ipsam ratione rem incidunt quasi quos, possimus cumque neque corporis, dignissimos deserunt perspiciatis totam. Totam itaque distinctio deserunt fugiat nostrum."
            },
        "secondary":{
            "image": {
                "src": "secondary-hero.jpg",
                "alt": "This is the secondary hero image"
            },
            "headline": "Secondary Headline",
            "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate nulla ipsam ratione rem incidunt quasi quos, possimus cumque neque corporis, dignissimos deserunt perspiciatis totam. Totam itaque distinctio deserunt fugiat nostrum."
            },
    }
}

我目前在 /pages/index.html 中有一个可以使用的把手循环，但使用了比较助手。显然，这种方法存在问题，因为它强制执行任意渲染顺序，并且在 json 中重复部分时也会失败：

{{#each config.modules}}
  {{#ifEqual @key "primary"}}
    {{> primary}}
  {{/ifEqual}}
  {{#ifEqual @key "secondary"}}
    {{> secondary}}
  {{/ifEqual}}
{{/each}}

更理想的是，循环应该是这样的：

{{#each config.modules}}
  {{ > @key }}
{{/each}}

当然失败了：

Panini: rendering error ocurred.
 { [Error: The partial @key could not be found]
  description: undefined,
  fileName: undefined,
  lineNumber: undefined,
  message: 'The partial @key could not be found',
  name: 'Error',
  number: undefined }

有没有办法做到这一点——通过 json 传递部分名称？

Answer 1

我对 Handlebars 不是很熟悉，所以可能有更好的方法，但我想出了这个：

Handlebars.registerHelper('renderPartial', (key) => key);

使用方法：

{{#each config.modules}}
  {{> (renderPartial @key) }}
{{/each}}

Answer 2

我已经根据这个帖子弄清楚了：https://github.com/ericf/express-handlebars/issues/121

“子表达式不解析变量，因此 [名称] 必须是函数。”

我创建了一个只返回一个字符串的助手：

getPartial

module.exports = function(name) {
    return name;
};

在 Handlebars 渲染循环中：

{{#each config.modules}}
  {{> (getPartial @key) }}
{{/each}}

它现在可以正确呈现。但是，当部分在 JSON 中重复时，它似乎仍然存在问题，它只呈现该部分的一个单一实例。

因此，虽然“次要”在 JSON 中包含两次，但它只呈现部分一次：

{
    "subject": "my email subject",
    "pretext": "this is the pretext text",
    "modules": {
        "primary":{
            "image": {
                "src": "primary-hero.jpg",
                "alt": "This is the primary image"
            },
            "headline": "Primary Headline",
            "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate nulla ipsam ratione rem incidunt quasi quos, possimus cumque neque corporis, dignissimos deserunt perspiciatis totam. Totam itaque distinctio deserunt fugiat nostrum."
            },
        "secondary":{
            "image": {
                "src": "secondary-hero.jpg",
                "alt": "This is the secondary hero image"
            },
            "headline": "Secondary Headline",
            "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate nulla ipsam ratione rem incidunt quasi quos, possimus cumque neque corporis, dignissimos deserunt perspiciatis totam. Totam itaque distinctio deserunt fugiat nostrum."
            },
        "secondary":{
            "image": {
                "src": "secondary-hero.jpg",
                "alt": "This is the secondary hero image"
            },
            "headline": "Secondary Headline",
            "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate nulla ipsam ratione rem incidunt quasi quos, possimus cumque neque corporis, dignissimos deserunt perspiciatis totam. Totam itaque distinctio deserunt fugiat nostrum."
            },
    }
}

这一定与渲染列表处于循环中并且@key必须唯一这一事实直接相关？如果我直接列出部分，它将按预期呈现“次要”两倍：

{{> primary}}
{{> secondary}}
{{> secondary}}