Nodejs使用Express构建Web项目,使用html文件代替jade模板

博主使用WebStrom开发工具,创建Node.js Express App项目,实际上就是web项目。


创建成功后,可以看下项目结构:


views目录下生成了3个.jade的模板文件,这个格式的模板是Express默认的模板引擎,至于优缺点,大家自行查阅,反正博主是不习惯这样的模板写法,还是html写惯了,那么如何把项目的模板引擎换掉,可以使用html模板呢?

解决方法是使用Express的另一个模板引擎,ejs,node ejs是一个express模版解析引擎,用于解析html模版生成对应的html的解析器。语法和php有些类似,语法比较直观。

1、打开app.js文件,找到模板引擎设置的地方


修改成:


这里面需要安装ejs模块,使用npm命令安装到项目目录即可。

2、views目录下模板文件使用.html文件替换


3、运行项目,访问项目地址。


最后介绍下ejs在模板展示数据方面的不同之处:

1、<% code %>用于执行其中javascript代码;

2、<%= code %>会对code进行html转义;

3、<%- code %>将不会进行转义;


下面是例子:

访问项目地址时会收到请求,请求返回数据,title,和用户数组。


前端显示:


前端模板处理数据方式:



  • 0
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值