文章目录
ejs模板的三种用法
const ejs = require('ejs');
const path = require('path');
const html = '<div><%= user.name %></div>'
const options = {}
const data = {
user: {
name: 'io'
}
}
// 1. 多次复用
const template = ejs.compile(html, options);
const compiled = template(data)
console.log(compiled);
// 2. 只用一次
const rendered = ejs.render(html, data, options);
console.log(rendered);
// 3. 读取html, promise调用
const renderedfile = ejs.renderFile(path.resolve(__dirname, './index.html'), data, options);
renderedfile.then(file => console.log(file))
ejs不同标签的含义
<% if(user){ %> <% } %> ‘脚本’标签,用于流程控制,无输出 <%_ %> 删除前面的空格 <%= user.name %> 输出数据到模板(转义字符, HTML标签) <%- %> 输出非转义字符 <%# 这是注释%> 注释 %> 结束标签 <%% 输入字符串’<%’ -%> 删除紧随其后的换行符 <% _%> 将结束标签后的空格删除
包含
<!-- footer.html -->
<div>footer: user is <%= user.name %> </div>
<%- include('./footer.html', {user}) %>
分隔符
// 传给ejs的加载器
const options = {
delimiter: '?'
}
fileloader
// 注意: fileloader里面添加的字符串模板会在每一次读取文件的时候运行一次
// 例如 下面在读取footer.html的时候再次进行了添加
ejs.fileLoader = function (filePath) {
console.log('fileLoader', filePath);
const content = '<div>footer: user is <?= user.name ?> </div>'+fs.readFileSync(filePath, 'utf8').toString();
return content;
}
ejs.renderFile(path.resolve(__dirname, './index.html'), data, options, (err, file) => {
console.log(file);
});
// <div>footer: user is john </div><%if(user){ -%>
// <% for (var i=0; i < 10; i++){ -%>
// <%_ %><div><%= user.name -%></div>
// <%} -%>
// <%} -%>
// <div>footer: user is john </div><div>footer: user is john </div>