把手将“@partial-block”内容移动到页面末尾

mas*_*oud 8 html handlebars.js webpack-handlebars-loader

我正在使用带有 webpack 和 handlebars-loader(用于 webpack 的把手模板加载器)的handlebars 来实现一个多页 web 应用程序。下面是我的视图文件夹的结构(.hbs 文件)

  • 意见
    • 成分

      • 侧边栏.hbs
    • 布局

      • 默认.hbs
      • 产品.hbs
    • 索引.hbs

    • product-1.hbs

    • product-2.hbs

    • ...

我的问题是我在车把中看到了“部分阻止”的奇怪行为。我有两个布局来包装每个页面的主要内容。但我的布局没有在右行加载“部分块”。我在布局中使用部分块的任何地方,把手都会在该位置关闭正文和 html 标记,并在 html 关闭标记之后呈现部分块内容。

下面是我在 body 内加载部分块的示例默认布局:

<!DOCTYPE html>
<html dir="rtl">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>{{meta.title}}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
</head>

<body class="theme-light">

    {{#if @partial-block}}
    {{> @partial-block }}
    {{/if}}
</body>

</html>
Run Code Online (Sandbox Code Playgroud)

我的 index.hbs 文件使用默认布局

{{> layouts/default }}
<main id="index" class="index">
    <p>This is index content</p>
</main>

{{layouts/default}}
Run Code Online (Sandbox Code Playgroud)

并呈现 html 文件

<!DOCTYPE html>
<html dir="rtl">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>My Test Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
</head>

<body class="theme-light">

</body>

</html>
<main id="index" class="index">
    <p>This is index content</p>
</main>
Run Code Online (Sandbox Code Playgroud)

就像我说的,主标签在关闭 html 标签之后出现,这不是预期的行为。

小智 0

语法错误。

你应该这样输入。

{{#> layouts/default }}
  <main id="index" class="index">
    <p>This is index content</p>
  </main>
{{/layouts/default}}
Run Code Online (Sandbox Code Playgroud)