express的app对象
2016-03-06 22:25
239 查看
app.engine
常规设置:views, 放模板文件的目录,比如: app.set('views', './views') view engine, 模板引擎,比如: app.set('view engine', 'ejs')
如上按照ejs的写法就可以渲染我们的页面的,但是很恶心,至少我觉得,个人写html习惯了,subtime还提供语法高亮和emmet快捷写法,使用ejs的写法,没颜色,没快捷。下面改造下,
app.set('views','./views'); app.set('view engine','html'); app.engine('.html',require('ejs').__express);
开始虽然知道这样写就可以了,但是总感觉理解的不到位,每次都不能自己写,换了个思路理解它.我们把模板引擎理解为一个打面机,进去的是小麦,出来的就是面粉了,市场上有很多打面机,我们怎么区分呢,自然想到起个名字,叫什么呢,为了和他所渲染的后缀名文件一致,我想要渲染html文件,那我就把这个引擎起名叫html,并在
app.set('views engine')指定。
那么问题来了,你以为把打面机名改了,你就能打面了?显然不能,我们还要继续改造一下我么的打面机(引擎),通过
app.engine('.html',callback());那么这个引擎到底在里面做了什么工作,实现了这个转化功能呢?而且这里你渲染的是
'.html'文件,出来的也是,那还要模板引擎干什么?首先我们要理解下模板引擎在渲染模板的时候都做了什么,摘自express官网例子
var fs = require('fs'); // 此模板引擎依赖 fs 模块 app.engine('ntl', function (filePath, options, callback) { // 定义模板引擎 fs.readFile(filePath, function (err, content) { if (err) return callback(new Error(err)); // 这是一个功能极其简单的模板引擎 var rendered = content.toString().replace('#title#', '<title>'+ options.title +'</title>') .replace('#message#', '<h1>'+ options.message +'</h1>'); return callback(null, rendered); }) }); app.set('views', './views'); // 指定视图所在的位置 app.set('view engine', 'ntl'); // 注册模板引擎
这里看着就明显多了,模板引擎的大致作用就是读取要渲染的文件,把传入进来的后台变量,渲染成我们所要的文件,这里核心的就是把我们后台获取的内容结合模板渲染成html文件,传到客户端显示,内容通过变量解决,html标签通过渲染引擎的特殊格式语法转化,但是假如我们本来就是html标签,那就算不符合他所指定的语法,也没事,因为他本来就是,那么总结下作用:读取(fs.readfile)要渲染的文件(特殊后缀名.html .ejs .jade),渲染成我们要的(.html),而实现这个过程就要靠
callback(filePath, options, callback)这个了。而兼容express的引擎会通过
require('ejs').__express返回这个回调函数,这样就实现了我们的要求。这也解释了express官网上的其它写法。
app.engine('html', require('ejs').renderFile); 或 var engines = require('consolidate'); app.engine('haml', engines.haml); app.engine('html', engines.hogan);
这里再复习下我原来的写法。
app.set('views','./views'); app.set('view engine','html'); app.engine('.html',require('ejs').__express);
这样我们就可以使用<%=%> 啦。
相关文章推荐
- Objective-c 内存管理
- 20天实现【足迹】APP(1)
- Objective-c (多输入参数的方法)
- android ViewFlipper实现图片轮播
- 14、 android性能优化总结
- android线程池
- iOS 静态库,动态库与 Framework
- android Bitmap用法总结
- Android自定义ImageView(二)——实现双击放大与缩小图片
- IOS控件之音频学习之旅
- Object-c基础(2)
- 搭建融云APP Server
- Android在onCreate()方法中动态获取TextView控件的高度
- iOS边练边学--xib文件初使用
- Android访问SD卡的工具类
- 【黑马Android】(01)android简介/工程目录结构/拨号器/四种点击事件/后台偷偷发短信
- 如何获取app 崩溃信息
- IOS项目去除NSLog
- Android拖动和缩放
- IOS-如何锁定Xcode的API头文件