玉模板引擎，如何使用layout.jade？
Posted
技术标签:
【中文标题】玉模板引擎，如何使用layout.jade？【英文标题】：jade template engine, how to use layout.jade? 【发布时间】：2012-01-14 05:05:05 【问题描述】：我在 node.js 中有一个网站；创建一个页面，比如mypage 我注意到我需要同时创建layout.jade 和mypage.jade 文件。如果我将代码放在mypage.jade 中，它不会显示，所以首先我必须用页面布局填充layout.jade。
我的问题是，我如何在layout.jade 中引用我想将mypage.jade 的内容加载到某个容器中，例如？我可以有相同布局的不同页面吗？我该怎么做？
谢谢
【问题讨论】：
是的，很抱歉没有提及。我正在使用 Express。 【参考方案1】：http://expressjs.com/guide.html#view-rendering
如果您不想使用布局，可以全局禁用它们：
app.set('view options',
layout: false
);
如果您不这样做，默认情况下会启用布局，Express 会在 your_view_folder/layout.jade 中搜索标准布局
您可以为每条路线指定单独的布局：
res.render('page', layout: 'mylayout.jade' );
// you can omit .jade if you set the view engine to jade
您的布局文件可能是这样的：
doctype html
html(lang="en")
head
title Testing 123
body
div!= body
请注意，正文将取自“mypage.jade”。
编辑：
这是一个应用程序中的真实示例：
应用程序文件（包含路由和配置）：https://github.com/alexyoung/nodepad/blob/master/app.js
布局文件：https://github.com/alexyoung/nodepad/blob/master/views/layout.jade
【讨论】：
现在我正在做的是res.render(__dirname+'/pages/index.jade', user: usr);，所以你说的是给包装我的用户的对象也添加一个名为布局的字段：并给我的布局？因为现在它已经使用了布局，即使我没有指定它（不加载 index.jade 但布局。此外， div= body 需要什么？给定 .jade 文件的正文？
正如我在消息中所说，默认情况下启用布局。 res.render('index.jade', user: usr, layout: false ) 如果您不想要特定页面的布局，也可以这样做，否则为布局提供一个值。 Body = .jade 文件的内容是
非常感谢，您究竟是在哪里读到的？我在翡翠网站上四处搜索，但找不到真正有用的东西。
检查我的消息的第一行：expressjs.com/guide.html#view-rendering 我看过那里。另请看我留言的最后，我给了你一个使用jade的真实应用程序的链接。
这是正确的。但是，请注意，在常见用例中，您想要呈现未转义的 HTML，因此您必须使用 != 而不是 =。我不得不参考这个例子来解决这个问题。感谢您引导我找到答案。【参考方案2】：
聚会有点晚了，但我最初很难找到答案...... 在 layout.jade 中
doctype html
html(lang="en")
head
body
h1 Hello World
block myblock
然后在 index.jade 中
extends layout
block myblock
p Jade is cool
将渲染
<!DOCTYPE html>
<html lang="en">
<head>
<body>
<h1>Hello World</h1>
<p>Jade is cool</p>
</body>
</html>
【讨论】：
!= body 有什么作用？在此处需要更多详细信息。 @qodeninja - 来自文档：“未转义的缓冲代码以 != 开头，并输出评估模板中 javascript 表达式的结果。这不会进行任何转义，因此对用户输入不安全"【参考方案3】：在快递 3.x 中
使用 Jade 块，而不是布局
http://www.devthought.com/code/use-jade-blocks-not-layouts/
【讨论】：
【参考方案4】：我知道一种方法可以给我最好的结果，即使是 angular（代替 angular-route/ng-view）
首先需要安装 express-layout：
npm install --save express-layout
之后，express 将在您的 views/ 文件夹中搜索 layout.jade 文件。所以，在里面你可以使用：
views/layout.jade
html
head
meta(charset='utf-8')
title= title
body
div!= body
views/home.jade
h1 Welcome aboard, matey!
server.js
var express = require('express'),
layout = require('express-layout');
var app = express();
app.get('/', function(req, res)
res.render('home',
title: 'Welcome!'
);
默认情况下express会在你的views/文件夹中搜索layout.jade，但是你可以改变默认，通过使用（是的，不需要写.jade扩展名）：
app.set('layout', 'default');
之后 express 将使用 views/default.jade 作为默认布局。
此外，如果您想在特定页面中使用不同的布局，您可以使用：
app.get('/', function(req, res)
res.render('home',
layout: 'login',
title: 'Welcome!'
);
这里 express 会将 login.jade 渲染为布局。
我假设您使用 Jade 作为默认视图引擎，并且不要更改视图的默认文件夹。
这里是express-layout doc。
【讨论】：
以上是关于玉模板引擎，如何使用layout.jade？的主要内容，如果未能解决你的问题，请参考以下文章
[js高手之路]Node.js模板引擎教程-jade速学与实战4-模板引用,继承,插件使用