node.js - Jade 模板布局不能与 Node.js 结合使用

Question

我正在尝试在 Node.js 中创建一个使用 Jade 模板和布局的简单服务器。 由于某种原因，它只会加载模板而不是布局。

这是我得到的:

ma​​in.js

var express = require('express');

var app = express.createServer();

app.set('views', __dirname + '/views'); 
app.set('view engine','jade');
app.set('view options', {
 layout: true
});

app.get('/', function(req,res) {
res.render('index', { title: 'My site' });
});

app.listen(4000);

如您所见，布局已启用。我试过直接在渲染方法中引用它，但它没有任何区别。值得注意的是，“标题:'我的网站'”也不起作用。

index.jade

h2 Hello!
p I really hope this is working now

lo.jade

!!! 5
html
  head
    title Why won't this work
  body
    h1 I AM A LAYOUT
    div= body

这是我的npm 列表:

├─┬ express@3.0.0alpha1 
│ ├── commander@0.5.2 
│ ├─┬ connect@2.1.2 
│ │ ├── crc@0.1.0 
│ │ ├── formidable@1.0.9 
│ │ ├── mime@1.2.4 
│ │ └── qs@0.4.2 
│ ├── debug@0.6.0 
│ ├── mime@1.2.5 
│ └── mkdirp@0.3.1 
└─┬ jade@0.24.0 
  ├── commander@0.5.2 
  └── mkdirp@0.3.0 

关于为什么这不起作用的任何想法？

Answer 1

我认为您的布局方式错误。我是这样做的:

我将布局设置为 false :

app.set('view options', {
    layout: false
});

在 layout.jade 文件中:

doctype 5
html(lang="en")
    head
        title MySite #{title}
body
    block mainContent

在渲染页面中(比如说:home.jade)，其中包含一个变量(内容)

extends layout

block mainContent
    h1 This is home
    p= content

您可以拥有基于(扩展)具有不同变量(用户)的相同布局(other.jade)的另一个页面

extends layout

block mainContent
    h1 Oh look ! Another page
    p= user

然后这样称呼他们:

app.get('/', function(req, res) {
    res.render('home', { 
        title : "Home",
        content: "Some Home page content"
    });
});

app.get('/anotherPage', function(req, res) {
    res.render('other', { 
        title : "Other page",
        user: "Here goes a user name"
    });
});