NodeJS - Express 3.0下ejs模板使用 partial展现 片段视图

如果你也在看Node.js开发指南,如果你也在一步一步实现 microBlog 项目!也许你会遇到本文提到的问题,如果你用的是Express 3.0

本书实例背景是 Express 2.0 而如今升级到 3.0后去掉了一些老的方法也更新了一些新的,所以变化还是蛮大的.

首先上一篇博客提到的一个问题:

如何用Express 3.0 生成一个 ejs 模板项目

前提是你已经下载了ejs包,如何下载,运行cmd 输入 npm install ejs -g

2.0 下的语法是:express -t ejs microblog

3.0下的语法是:express -e ejs microblog  (-t已经失效,取而代之的是 -e ,而3.0默认生成的是 jade 模板,此模板作者正是Express作者)

如何用Express 3.0 使用片段视图

就像asp.net里面的用户自定义控件,可以代码重用,相同的视图片段可以直接调用

2.0下的语法是:ejs模板文件里直接这样写 <ul><%- partial(‘listitem’,items) %></ul>    partial() 正是调用片段视图函数,接受2个参数,参数一表示模板名,参数二表示出入的对象数据.

3.0下使用相对麻烦点:

此方法在3.0下独立成了一个Express 的插件,所以要提前下载

(1)运行cmd 输入:npm install express-partials -g

(2)下载成功后.在app.js 中引用此插件   var partials = require(‘express-partials’);

(3)然后再开启此插件, 在app.js 中 app.set(‘view engine’, ‘ejs’);  代码后添加如下代码:  app.use(partials());

(4)package.json 里 dependencies 配置项添加  ”express-partials”: “*”   注意格式,下面列出 package.json 全部内容

{
"name": "application-name",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node app.js"
},
"dependencies": {
"express": "3.3.4",
"ejs": "*",
"express-partials": "*"
}
}

你可以直接复制上面的内容覆盖 package.json元内容

截止到此处你的Express 3.0下就可以使用 partial 片段视图了.

在view模板文件夹下新建 list.ejs 文件,内容是: <ul><%- partial(‘listitem’,items) %></ul>  和 listitem.ejs  内容是:<li><%= listitem %></li>

然后app.js 里添加一个路由来运行 list 模板创建的html页面.

添加路由控制如下:

app.get('/list',function(req,res){
res.render('list',{title:'List',
items:['xiaoxiao','moke','isoso','webUI']
});
});

保存,运行 app.js ,请求路径:localhost:3000/list