Ejs 备忘清单 & ejs cheatsheet & Quick Ref

使用数据渲染

let ejs = require('ejs');

let people = ['geddy', 'neil', 'alex'];
let tpl = '<%= people.join(", "); %>';

let html = ejs.render(tpl, {
  people: people
});
console.log(html);

向 EJS 传递模板字符串和一些数据

浏览器支持

<script src="ejs.js"></script>
<script>
  let people = ['geddy', 'neil', 'alex'];
  let html = ejs.render(
    '<%= people.join(", "); %>',
    { people: people }
  );
</script>

在脚本标签中使用 ejs


`<%= var %>`	打印变量的值
`<%- var %>`	打印时不进行 HTML 转义

方法

let ejs = require('ejs');
let template = ejs.compile(str, options);

template(data);
// => 渲染的 HTML 字符串

ejs.render(str, data, options);
// => 渲染的 HTML 字符串

ejs.renderFile(filename, data, options,
  function(err, str){
      // str => 渲染的 HTML 字符串
  }
);

包括文件

<%- include('partials/navbar.ejs') %>

包含带有数据的模板：

<% include('header', { title: 'My Page' }) %>

<ul>
  <% users.forEach(function(user){ %>
    <%- include('item', {user: user}); %>
  <% }); %>
</ul>

要包含模板，需要文件名选项，路径是相对的

自定义分隔符

let ejs = require('ejs'),
    users = ['geddy', 'neil', 'alex'];

// 只需一个模板
ejs.render('<?= users.join(" | "); ?>',
    {users: users},
    {delimiter: '?'});
// => 'geddy | neil | alex'

// 或全局范围内
ejs.delimiter = '$';
ejs.render('<$= users.join(" | "); $>',
    {users: users});
// => 'geddy | neil | alex'

例子

<div id="output"></div>
<script src="ejs.min.js"></script>
<script>
  let people = ['geddy', 'neil', 'alex'],
      html = ejs.render('<%= people.join(", "); %>', {people: people});
  // With jQuery:
  $('#output').html(html);
  // Vanilla JS:
  document.getElementById('output').innerHTML = html;
</script>

注意事项

let str = "Hello <%= include('file', {person: 'John'}); %>",
      fn = ejs.compile(str, {client: true});

fn(data, null, function(path, d){ // include callback
  // path -> 'file'
  // d -> {person: 'John'}
  // Put your code here
  // Return the contents of file as a string
}); // returns rendered string

选项列表

选项	描述
`cache`	编译后的函数被缓存，需要文件名
`filename`	由缓存用于关键缓存，并用于包含
`root`	使用绝对路径（例如 `/file.ejs`）设置包含项目的根目录。可以是一个数组来尝试解析来自多个目录的包含。
`views`	解析包含相对路径时要使用的路径数组。
`context`	函数执行上下文
`compileDebug`	当 `false` 时，不编译任何调试工具
`client`	返回独立编译的函数
`delimiter`	用于内部分隔符的字符，默认为 `%`
`openDelimiter`	用于打开分隔符的字符，默认为 `<`
`closeDelimiter`	用于结束分隔符的字符，默认为 `>`
`debug`	输出生成的函数体
`strict`	当设置为 `true` 时，生成的函数处于严格模式
`_with`	是否使用 `with() {}` 构造。如果为 `false`，则局部变量将存储在局部变量对象中。（暗示`--strict`）
`localsName`	不使用时用于存储局部变量的对象的名称默认为局部变量
`rmWhitespace`	删除所有可安全删除的空格，包括前导和尾随空格。它还为所有 `scriptlet` 标记启用了更安全版本的 `-%>` 行吸收（它不会在行中间去除新的标记行）
`escape`	与 `<%=` 构造一起使用的转义函数。它用于渲染，并在生成客户端函数时进行 `.toString()` 处理。（默认情况下转义 XML）
`outputFunctionName`	设置为字符串（例如 `echo` 或 `print`），以便函数在 `scriptlet` 标签内打印输出
`async`	当 `true` 时，EJS 将使用异步函数进行渲染。（取决于 `JS` 运行时中的 `async`/`await` 支持

标签列表

标签	描述
`<%`	'Scriptlet' 标签，用于控制流，无输出
`<%_`	“Whitespace Slurping”Scriptlet 标签，删除其前面的所有空格
`<%=`	将值输出到模板中（HTML 转义）
`<%-`	将未转义的值输出到模板中
`<%#`	注释标签，不执行，不输出
`<%%`	输出文字 `<%`
`%>`	普通结束标签
`-%>`	修剪模式（'newline slurp'）标签，修剪换行符后的内容
`_%>`	“Whitespace Slurping”结束标签，删除其后的所有空格

Cli 列表

选项	描述
`cache`	编译后的函数被缓存，需要文件名
`-o / --output-file FILE`	将渲染的输出写入 FILE 而不是 stdout。
`-f / --data-file FILE`	必须是 JSON 格式。使用来自 FILE 的解析输入作为渲染数据。
`-i / --data-input STRING`	必须采用 JSON 格式和 URI 编码。使用来自 STRING 的解析输入作为渲染数据。
`-m / --delimiter CHARACTER`	使用带有尖括号的 CHARACTER 来表示打开/关闭（默认为 %）。
`-p / --open-delimiter CHARACTER`	使用 CHARACTER 而不是左尖括号来打开。
`-c / --close-delimiter CHARACTER`	使用 CHARACTER 而不是右尖括号来结束。
`-s / --strict`	当设置为 `true` 时，生成的函数处于严格模式
`-n / --no-with`	对变量使用 `locals` 对象，而不是使用 `with`（隐含--strict）。
`-l / --locals-name`	不使用“with”时用于存储局部变量的对象的名称。
`-w / --rm-whitespace`	删除所有可安全删除的空格，包括前导和尾随空格。
`-d / --debug`	输出生成的函数体
`-h / --help`	显示此帮助消息。
`-V/v / --version`	显示 EJS 版本。

使用示例：

$ ejs -p [ -c ] ./template_file.ejs -o ./output.html
$ ejs ./test/fixtures/user.ejs name=Lerxst
$ ejs -n -l _ ./some_template.ejs -f ./data_file.json

Ejs 备忘清单

入门

Hello world

安装

hello.ejs

命令 CLI

使用数据渲染

浏览器支持

变量

CLI

注释

方法

包括文件

文档

条件句

使用循环

自定义分隔符

缓存

布局

自定义文件加载器

客户端支持

例子

注意事项

选项

选项列表

标签

标签列表

Cli

Cli 列表