20-ejs入门 · Nodejs

# ejs入门新建项目someapp文件夹命令行npm init -y自动生成pakcage npm install ejs # EJS 使用注意：使用之前需安装包 npm install ejs。 ## 常用标签 * <%= 输出数据到模板（输出是转义 HTML 标签） * <%- 输出非转义的数据到模板 * <% 用于流程控制，无输出 * %> 一般结束标签 ## 用法--新建app.js ``` constejs=require('ejs'); let arr= ['张三', '李四', '王五']; //ejs.render(str, data, options); console.log(ejs.render('',{usre :arr})); // => 输出绘制后的 HTML 字符串 ``` ~~~ const ejs = require('ejs'); ejs.render(str, data, options); // => 输出绘制后的 HTML 字符串 ejs.renderFile(filename, data, options, function(err, str){ // str => 输出绘制后的 HTML 字符串 }); ~~~ * cache 缓存编译后的函数，需要提供 filename * filename 被 cache 参数用做键值，同时也用于 include 语句 * context 函数执行时的上下文环境 * compileDebug 当为 false 时不编译调试语句 * client 返回独立的编译后的函数 * delimiter 放在角括号中的字符，用于标记标签的开与闭 * debug 将生成的函数体输出 * \_with 是否使用 with() {} 结构。如果为 false，所有局部数据将存储在 locals 对象上。 * localsName 如果不使用 with ，localsName 将作为存储局部变量的对象的名称。默认名称是 locals * rmWhitespace 删除所有可安全删除的空白字符，包括开始与结尾处的空格。对于所有标签来说，它提供了一个更安全版本的 -%> (在一行的中间并不会剔除标签后面的换行符) * escape 为 <%= 结构设置对应的转义（escape）函数。它被用于输出结果以及在生成的客户端函数中通过 .toString() 输出。(默认转义 XML) ## 输出 ~~~ // 模板文件 out.ejs <h2><%= user.name %></h2> <h2><%- user.name %></h2> ~~~ ~~~ const ejs = require('ejs'); ejs.renderFile(__dirname + '/out.ejs', {user : {name : '<span>lony</span>'}}, (err, str) => { // str => 输出绘制后的 HTML 字符串 console.log(str); }); ~~~ ## 条件 ~~~ // 模板文件 if.ejs <% if (user) { %> <h2><%= user.name %></h2> <% } %> ~~~ ~~~ const ejs = require('ejs'); ejs.renderFile(__dirname + '/if.ejs', {user : {name : 'lony'}}, (err, str) => { console.log(str); }); ~~~ ## 循环 ~~~ // 模板文件 loop.ejs <% users.forEach((user) => { %> <%= user.id %> <%= user.name %> <% }) %> ~~~ ~~~ const ejs = require('ejs'); ejs.renderFile(__dirname + '/loop.ejs', {users : [{id : 1, name: 'xx'}, {id : 2, name: 'yy'}]}, (err, str) => { console.log(str); }); ~~~ # 使用模板技术响应 HTML ``` // books.ejs <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>书籍</title> </head> <body> <ul> <% books.forEach((book) => { %> <li><%= book %></li> <% }) %> </ul> </body> </html> ``` ``` const http = require('http'); const ejs = require('ejs'); // 使用模板技术响应 HTML 格式的数据 http.createServer((req, res) => { res.writeHead(200, {'Content-Type' : 'text/html'}); let data = {books: ['西游记', '三国演义', '水浒传', '红楼梦']}; ejs.renderFile(__dirname + '/books.ejs', data, (err, str) => { console.log(str); res.end(str); }); }).listen(8888); ```