使用Node.js，Handlebars和Express进行模板继承

Question

I'm just getting started with Node.js, so I'm building very simple applications in order to practice the basics. 我刚刚开始使用Node.js，所以我正在构建非常简单的应用程序以便练习基础知识。 I was trying to get some Django-like template inheritance working, but I'm at a bit of a loss on how to do it. 我试图让一些像Django一样的模板继承工作，但我对如何做它有点不知所措。

I understand that the library "express-handlebars" includes the concept of layouts, and I thought that might be the best way to go about it, but at first glance I don't know if it allows more than one step of inheritance, or using it for replacing different blocks (I saw one general layout where the other templates are inserted in place of the {{{body}}} tag, although there may very well be more tricks to it). 据我所知，图书馆“快递把手”包含了布局的概念，我认为这可能是最好的方法，但乍一看我不知道它是否允许不止一步的继承，或者使用它来替换不同的块（我看到了插入其他模板的一般布局代替{{{body}}}标签，尽管可能有更多的技巧）。

So, my question: how would one implement a multi-layered template inheritance (also, with children inserting content into different separate blocks, instead of a single one)? 所以，我的问题是：如何实现多层模板继承（同样，将子内容插入不同的单独块，而不是单个块）？ I'm using Node.js, Express and handlebars, but if it's not possible with the latter two I don't mind trying out other frameworks or templating languages. 我正在使用Node.js，Express和把手，但如果后两者不可能，我不介意尝试其他框架或模板语言。

Thanks! 谢谢！

Edit: 编辑：

A pseudo-coded example of what I mean: 我的意思的伪编码示例：

First, we could have a common outer template: 首先，我们可以有一个共同的外部模板：

<html>
    <head></head>
    <body>
        <h1> Main Title </h1>
        <h2> {{section name block}} </h2>
        <h3> {{subsection name block}} </h3>
        {{content block}}
    </body>
</html>

then another one under it (middle template), substituting some of the outer one's blocks (and potentially adding other ones): 然后在它下面的另一个（中间模板），替换一些外部的块（并可能添加其他块）：

{{inheriting from outer template}}
{{section name block}} Section Three {{/block}}

and finally an inner one, which would be the one to call from the javascript code: 最后是一个内部的，它将是从javascript代码调用的那个：

{{inheriting from middle template}}
{{subsection name block}} Subsection Two {{/block}}
{{content block}}
    <p>This is the content of Section Three, Subsection Two.</p>
{{/block}}

The result when processing the inner template would be: 处理内部模板时的结果是：

<html>
    <head></head>
    <body>
        <h1> Main Title </h1>
        <h2> Section Three </h2>
        <h3> Subsection Two </h3>
        <p>This is the content of Section Three, Subsection Two.</p>
    </body>
</html>

Answer 1

It not 100% clear what you're asking for with the term "inheritance" for templates, but handlebars templates can include templates which can include other templates which can include templates so you can nest as deep as you want. 它不是100％清楚你要求的模板术语“继承”，但手柄模板可以包括模板，其中可以包含其他模板，其中可以包含模板，以便您可以根据需要进行嵌套。

For example, I just use the syntax: 例如，我只使用语法：

{{> common_header}}

to embed the common_header template inside of the current template. 将common_header模板嵌入当前模板中。 That common_header could itself embed other templates in it and so on. common_header本身可以嵌入其他模板，依此类推。

You can also use layouts (discussed here ) which allows you to have a master-like template which different content can be rendered into. 您还可以使用布局（此处讨论），它允许您拥有类似于母版的模板，可以将不同的内容呈现到该模板中。

FYI, there's a discussion of a Django-like template inheritance using Handlebars here and here and a layouts extension for Handlebars here and more discussion of using layouts in Handlebars here . FYI，还有使用车把上的Django类模板继承的讨论，在这里和这里和布局扩展把手在这里和在车把使用的布局更多的讨论在这里。

Answer 2

Swig seems to have that functionality Swig似乎有这个功能

http://paularmstrong.github.io/swig/docs/#inheritance http://paularmstrong.github.io/swig/docs/#inheritance

Haven't personally used it but looks like the same inheritance syntax as PHP's Twig, so should be OK 没有亲自使用它，但看起来像PHP的Twig一样的继承语法，所以应该没问题

Answer 3

Anyone landing on this question may want to know about this : Swig is no longer supported as their github says 任何登陆此问题的人都可能想知道这一点：正如他们的github所说，不再支持Swig

That said, Nunjucks looks like the only alternative out there for extensible templating in Javascript. 也就是说， Nunjucks看起来是Javascript中可扩展模板的唯一选择。 The syntax is very similar to the one of Twig (PHP) 语法非常类似于Twig（PHP）

I hope this helps 我希望这有帮助

使用Node.js，Handlebars和Express进行模板继承

问题描述

3 个解决方案

解决方案1
3 2015-03-04 19:32:30

解决方案2
2 2015-03-04 19:37:29

解决方案3
0 2017-11-16 11:01:30

使用Node.js，Handlebars和Express进行模板继承

问题描述

3 个解决方案

解决方案1 3 2015-03-04 19:32:30

解决方案2 2 2015-03-04 19:37:29

解决方案3 0 2017-11-16 11:01:30

解决方案1
3 2015-03-04 19:32:30

解决方案2
2 2015-03-04 19:37:29

解决方案3
0 2017-11-16 11:01:30