使用 Node.js、Handlebars 和 Express 进行模板继承
Posted
技术标签:
【中文标题】使用 Node.js、Handlebars 和 Express 进行模板继承【英文标题】:Template inheritance with Node.js, Handlebars and Express 【发布时间】:2015-05-05 22:50:03 【问题描述】:我刚刚开始使用 Node.js,所以我正在构建非常简单的应用程序来练习基础知识。我试图让一些类似 Django 的模板继承工作,但我对如何做到这一点有点茫然。
我知道库“express-handlebars”包含布局的概念,我认为这可能是最好的方法,但乍一看我不知道它是否允许不止一个步骤继承,或者使用它来替换不同的块(我看到了一种通用布局,其中插入了其他模板来代替 body 标记,尽管它可能还有更多技巧)。
所以,我的问题是:如何实现多层模板继承(还有,孩子将内容插入不同的单独块,而不是单个块)?我正在使用 Node.js、Express 和车把,但如果后两者无法实现,我不介意尝试其他框架或模板语言。
谢谢!
编辑:
我的意思的伪代码示例:
首先,我们可以有一个通用的外部模板:
<html>
<head></head>
<body>
<h1> Main Title </h1>
<h2> section name block </h2>
<h3> subsection name block </h3>
content block
</body>
</html>
然后是它下面的另一个(中间模板),替换一些外部的块(并可能添加其他块):
inheriting from outer template
section name block Section Three /block
最后是一个内部的,它是从 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
处理内部模板时的结果是:
<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>
【问题讨论】:
【参考方案1】:对于模板的“继承”一词,您所要求的不是 100% 清楚,但车把模板可以包含模板,这些模板可以包含其他模板,这些模板可以包含模板,因此您可以嵌套任意深度。
例如,我只是使用语法:
> common_header
在当前模板中嵌入common_header
模板。 common_header
本身可以在其中嵌入其他模板等等。
您还可以使用布局(讨论过here),它允许您拥有一个类似大师的模板,可以将不同的内容呈现到其中。
仅供参考,讨论了使用 Handlebars here 和 here 的类 Django 模板继承以及 Handlebars here 的布局扩展以及更多关于在 Handlebars here 中使用布局的讨论。
【讨论】:
谢谢!我在主帖中添加了一个我正在考虑的继承类型的示例。我会检查其他讨论。【参考方案2】:Swig 似乎有这个功能
http://paularmstrong.github.io/swig/docs/#inheritance
个人没用过,不过看起来跟php的Twig继承语法一样,应该没问题
【讨论】:
我的问题是关于如何在 Handlebars 中进行继承,而不是如何找到其他模板系统。 谢谢!我会尝试找到使用 Handlebars 的方法,但如果我做不到,我会尝试 Swig。 也许可以试试这个方法:gist.github.com/mmcgahan/9fa045d98c7c122f1c0b 似乎比传统的单继承更优雅(基本上你为命名块定义内容然后包括“继承”模板)【参考方案3】:遇到此问题的任何人都可能想知道这一点:Swig 不再受支持,因为他们的github says
也就是说,Nunjucks 看起来是 Javascript 中可扩展模板的唯一替代方案。语法与 Twig (PHP) 的语法非常相似
希望对你有帮助
【讨论】:
以上是关于使用 Node.js、Handlebars 和 Express 进行模板继承的主要内容,如果未能解决你的问题,请参考以下文章
Handlebars 和 Node.js:#if !user 然后显示登录按钮
使用 Node.js 和 express-handlebars 从 JSON 文件渲染 html
Passport js,使用 Handlebars 获取用户输入
KoaHub.js -- 基于 Koa.js 平台的 Node.js web 快速开发框架之koahub-handlebars