Express 3 和 EJS 中的布局
Posted
技术标签:
【中文标题】Express 3 和 EJS 中的布局【英文标题】：Layouts in Express 3 and EJS 【发布时间】：2012-09-18 23:05:47 【问题描述】：在 Express 版本 3 中删除了一些功能：
the concept of a "layout" (template engine specific now)
partial() (template engine specific)
更新日志：https://github.com/visionmedia/express/wiki/Migrating-from-2.x-to-3.x
partial() 可以更改为 EJS 自己的名为 include 的功能，但布局的替代方案是什么？
【问题讨论】：
【参考方案1】：似乎从 Express 3 开始，布局功能被委托给模板引擎负责。您可以使用 ejs-locals (https://github.com/RandomEtc/ejs-locals) 进行布局。
安装 ejs-locals
npm install ejs-locals --save
在 app.js 中使用 ejs-locals 作为您的应用引擎
var express = require('express');
var engine = require('ejs-locals');
...
app.engine('ejs', engine);
app.set('view engine', 'ejs');
现在你可以使用布局了
layout.ejs
<body>
<%- body %>
</body>
index.ejs
<% layout('layout') -%>
<div class="container">
<div class="jumbotron">
...
另一种选择是使用 express-partials (https://github.com/publicclass/express-partials)。两者做同样的事情，所以这只是你的选择。
【讨论】：
对于有问题的项目，我使用了express-partials github.com/publicclass/express-partials，但似乎ejs-locals 提供了几乎相同的功能。
我最近来到了 Node.js，心里也有同样的问题。是的，两者做同样的事情。感谢您将其标记为答案。很荣幸！
ejs-locals 不再维护，很遗憾。【参考方案2】：
我也为此苦苦挣扎。所以我建立了一个 github 项目，其中包含 ejs 和dustjs 的示例。
https://github.com/chovy/express-template-demo
我不确定部分和包含之间的区别，您不需要显式将数据传递给包含。不知道你为什么想要一个部分。
但对于布局，您只需像这样指定一个块：
//layout.ejs
<html>
<%- body %>
</html>
//page1.ejs
<% layout('layout') -%>
This is loaded from page 1 and overrides <%- body %> in the layout.ejs.
如果有人想添加更多示例，只需提交拉取请求。
【讨论】：
谢谢，我会调查的。关于partial 与include：似乎partial 是Express 功能（在3.0 中删除）而include 是EJS 机制。对我来说partial 有一个好处——可以将对象传递给它，而不会公开传递给视图的所有数据。顺便说一句，您可以使用它，因为您的 package.json 中有 ejs-locals。
而且似乎来自layout() 的支持来自ejs-locals，您使用的不是EJS 本身。
是的，ejs-locals 会给你布局。【参考方案3】：
您可以使用“包含”选项模仿 Express 2.x 中的 EJS 布局。在这里查看我的答案：
https://***.com/a/12477536/446681
【讨论】：
包含不同于布局。 @chovy - 同意。但是对于基本的简单目的，您可以使用包含，就像您使用布局一样。 这基本上就像过去的服务器端包含，我不建议走这条路。以上是关于Express 3 和 EJS 中的布局的主要内容，如果未能解决你的问题，请参考以下文章
Express Js EJS 布局错误：未指定默认引擎且未提供扩展名
我想使用 Jquery .change(function... (JS, EJS, Mongoose, Express) 显示数组中的特定项目
使用 Express 为 AngularJS 渲染一个 .ejs 模板并使用 AngularJS $scope 中的数据