Question

我将Handlebars用于一个简单的Node.js项目，我想在部分中插入多个只的变量。

我有一个layout，其中包含我的html页面的基本框架（html和head标签）。我呈现的页面通常都是相同的，包含以下代码：

{{> default/header
  help_title="This is the title of my help modal."
  help_body="<p>This is the body.</p>"
}}

<main class="vertical-center">
  <div class="container-fluid">
    <div class="row justify-content-center">
      <div class="col-12 col-lg-8 justify-content-center align-items-center">
        <!-- THE CONTENT THERE -->
      </div>
    </div>
  </div>
</main>

{{> default/footer}}

根据页面本身的不同，我可能不想显示页眉和/或页脚（因此我会删除该行）。

我的需要：我想将main部分包装成部分（因为以外的所有内容都是不变的）或任何可以完成工作和提供的内容它不仅很少的单词（如标题中），但可能有很多HTML代码。我在文档中找不到办法。像这样的东西，基本上有点像布局：

{{> default/main
  <!-- THE RAW HTML CONTENT THERE -->
}}

Answer 1

Handlebars以partial blocks的形式支持完全您所描述的内容。部分块的默认行为是呈现默认内容如果无法找到部分内容。但是，有一个特殊的内置助手@partial-block会将内容注入你的部分内容。

来自文档：

此块语法也可用于将模板传递给partial，这可以由特别命名的部分@partial-block执行。

在您的部分内容中，您将添加{{> @partial-block }}您希望注入内容的位置。在您的情况下，您的“主要”部分将如下所示：

<main class="vertical-center">
    <div class="container-fluid">
        <div class="row justify-content-center">
            <div class="col-12 col-lg-8 justify-content-center align-items-center">
                {{> @partial-block }}
            </div>
        </div>
    </div>
</main>

然后，调用“main”部分的页面将使用块语法和要注入块标记内部分的内容：

{{#> main}}
    <p>THE RAW HTML CONTENT HERE</p>
{{/main}}

我创建了一个fiddle供您参考。

如何在Handlebars部分中插入html块

1 个答案: