Nodejs在进行渲染前端文件的时候,可以使用ejs或者swig渲染引擎
下面是两种方法来进行渲染html文件
方式一:使用ejs渲染引擎
后台JS文件
var express=require('express');
var ejs=require('ejs');
app=express();
//设置渲染文件的目录
app.set('views','./views');
//设置html模板渲染引擎
app.engine('html',ejs.__express);
//设置渲染引擎为html
app.set('view engine','html');
//调用路由,进行页面渲染
app.get('/',function(request,response){
//调用渲染模板
response.render('login',{
//传参
title:'首页', content:'Render template'
});
});
app.listen(8005);
console.log('http://127.0.0.1:8005');
HTML模板文件
在使用ejs模板引擎传输参数,接受的时候参数包含在<%=%>
里面.例如:<%=KeyName%>
<!DOCTYPE html>
<html style="height: 100%">
<head>
<meta charset="utf-8">
<!--<title>{{ title }}</title>-->
<title><%=title%></title>
</head>
<body style="height: 100%; margin: 0">
<h1><%=content%></h1>
</body>
</html>
效果
方式2:使用swig进行渲染html模板
后台JS文件
var express=require('express');
var swig=require('swig');
app=express();
//设置渲染文件的目录
app.set('views','./views');
//设置html模板渲染引擎
app.engine('html',swig.renderFile);
//设置渲染引擎为html
app.set('view engine','html');
app.listen(8005);
//调用路由,进行页面渲染
app.get('/',function(request,response){
//调用渲染模板
response.render('login',{
//传参
title:'首页', content:'Render template'
});
});
console.log('http://127.0.0.1:8005');
HTML模板文件
在使用swig模板引擎传输参数,接受的时候参数包含在{{}}
里面.例如:{{KeyName}}
<!DOCTYPE html>
<html style="height: 100%">
<head>
<meta charset="utf-8">
<title>{{title}}</title>
</head>
<body style="height: 100%; margin: 0">
<h1>{{content}}</h1>
</body>
</html>
效果
总结
引擎设置
使用ejs渲染html模板的时候,html引擎设置为:
app.engine('html',ejs.__express);
使用ejs渲染html模板的时候,html引擎设置为:
app.engine('html',swig.renderFile);
接收参数
ejs引擎接收参数方式: <%=KeyName%>
swig引擎接收参数方式:{{KeyName}}
以上就是nodejs对HTML模板进行渲染的两种方式,记录一下希望对你有用!