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 全部内容
1
2
3
4
5
6
7
8
9
10
11
12
13 |
{ "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页面.
添加路由控制如下:
1
2
3
4
5 |
app.get( ‘/list‘ , function (req,res){ res.render( ‘list‘ ,{title: ‘List‘ , items:[ ‘xiaoxiao‘ , ‘moke‘ , ‘isoso‘ , ‘webUI‘ ] }); }); |
保存,运行 app.js ,请求路径:localhost:3000/list