ejs学习笔记--nodejs（四）

ejs模板引擎

因为express默认的模板引擎为jade，如果你想生成ejs的程序骨架，可以使用以下命令生成程序：

express -e myapp
// 安装依赖包，这里是express和ejs
cd myapp && npm install

在app.js

// 设置视图的路径
app.set('views', path.join(__dirname, 'views'));
// 设置模板引擎为ejs
app.set('view engine', 'ejs');
// 如果你的ejs模板后缀为.html
app.set('view engine', 'html');
app.engine('.html', require('ejs').__express)；

一个简单的例子

在app.js中：

app.get('/', function(req, res) {
  res.render('index', {title: 'Express Ejs', message: 'hello world!'});
});

./views/index.ejs:

<!doctype html>
<html lang="zh_CN">
<head>
  <meta charset="UTF-8">
  <title><%= title %></title>
</head>
<body>
  <%= message%>
</body>
</html>

ejs参数设置及全局变量

app.get('/', function(req, res) {
  /*
    debug: 输出编译生成的函数体
    compileDebug：当为false时输出堆栈信息
    open: Open tag, defaulting to "<%"
    close: Closing tag, defaulting to "%>"
    escape: 转义字符函数
  */
  res.render('index', {title: 'Express Ejs', message: 'hello world!', debug: true});
});
// debug == true
var buf = [];
with (locals || {}) { (function(){
 buf.push('<!doctype html>\n<html lang="zh_CN">\n<head>\n  <meta charset="UTF-8">\n  <title>', escape((5,  title )), '</
title>\n</head>\n<body>\n  ', escape((8,  message)), '\n\n</body>\n</html>'); })();
}

使用全局变量：

// 使用app.locals为所有模板提供应用级变量
// 所有模板都能访问到header1变量
app.locals.header1 = 'app-level local variable';
// or
app.locals({header1: 'app-level local variable'});
// 使用app.set
// 模板中通过settings可访问
app.set('header2', 'single app-level local variable: settings')
<%= settings.header2%>

使用ejs的layout模板

由于express3以上的版本把layout默认给取消了，所以生成的ejs程序骨架时在views文件夹下并没有生成layout.ejs，如果想继续使用layout，可以安装express-partials

npm install express-partials --save

然后在app.js中：

app.set('view engine', 'ejs');
app.use(require('express-partials')());
app.get('/', function(req, res) {
  res.render('index', {layout: '模板名称(缺省使用layout.ejs)'});
});

views/layout.ejs文件：

<!doctype html>
<html lang="zh_CN">
<head>
  <meta charset="UTF-8">
  <title>express ejs</title>
</head>
<body>
  <div class="container">
    <%- body %>
  </div>
</body>
</html>

如果不想使用模板可以：

res.render('index', {layout: false});
// 所有视图都不使用layout
app.locals({layout: false});

使用partial

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

views/index.ejs文件中：(注意{user:user}一定要，不然会报错)

<%- partial('partials/user', {user:user})%>

views/partials/user.ejs文件：

<h3>Hello:<%= user.name%></h3>