ejs 模板类似于 jsp ,可以在模板里面根据变量动态生成网页。
1.1.1. <%= %> 原样显示
resp.render('ejs_temp', {
user: {
input: "<div>ABC</div>",
}
});
<div><%= user.input %></div>
渲染结果
<div>ABC</div>
1.1.2. <%- %> 转换内容
resp.render('ejs_temp', {
name: "<div>ABC</div>",
});
<div><%- name %></div>
渲染结果
ABC
1.1.3. 定义class
<style>
.class1 {
color: #00b7ff;
}
.class2 {
background-color: #abef98;
}
</style>
<div class="<%= "class1" %> <%= "class2" %>">Class1 Class2</div>
1.1.4. 定义href
<a href=<%= "/users/edit/" + user.id %> >修改</a>
1.1.5. 定义方法
resp.render('ejs_temp', {
user: {
name: "ABC",
age: 25,
}
});
<script>
function clickMe(arg1, arg2) {
console.log(arg1);
console.log(arg2);
}
</script>
<div onclick="clickMe(<%= "'" + user.name + "', " + user.age %>)">Click Me</div>
1.1.6. include
有两种写法,可以写被 include
的模板文件的扩展名,也可以不写。
<% include ejs_layout.ejs %>
<% include ejs_layout %>
ejs_include.ejs
<div><%= user.name %></div>
ejs_layout.js
<% include ejs_include.ejs %>
渲染
resp.render('ejs_layout', {
user: {
name: "ABC",
age: 25,
}
});
1.1.7. config
在模板文件中,可以访问到 app.locals
变量。
- config.js
var cfg = {
version : '1.0.1',
url : "http://www.xx.com",
};
module.exports = route;
- 设置locals
var cfg = require('./routes/config');
app.locals = cfg;
- 渲染内容
<div><%= version %></div>
1.1.8. 循环
<ul>
<% names.forEach(function(name){ %>
<li><%= name %></li>
<% }) %>
</ul>
resp.render('ejs_temp', {
user: {
name: ["ABC", "XYZ"],
}
});