Skip to content
Go back

ejs模板

Published:  at  05:30 AM

文章目录

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>


Previous Post
glob用法
Next Post
Nodejs多进程