博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
EJS模板引擎
阅读量:6905 次
发布时间:2019-06-27

本文共 2363 字,大约阅读时间需要 7 分钟。

前面的话

  nodejs的模板引擎有很多, EJS是比较简单和容易上手的。本文将详细介绍EJS

 

概述

  EJS是一个简单高效的模板语言,通过数据和模板,可以生成HTML标记文本。可以说EJS是一个JavaScript库,EJS可以同时运行在客户端和服务器端,客户端安装直接引入文件即可,服务器端用npm包安装

【安装】

  ejs可以配合express框架使用,或直接在node中/浏览器中使用

$ npm install ejs

【特点】

  1、快速编译和渲染

  2、简单的模板标签

  3、自定义标记分隔符

  4、支持文本包含

  5、支持浏览器端和服务器端

  6、模板静态缓存

  7、支持express视图系统

 

用法

    
Document

 

方法

【ejs.compile(str,[option])】

  编译字符串得到模板函数,参数如下

str:需要解析的字符串模板option:配置选项
var template = ejs.compile('<%=123 %>');var result = template();console.log(result);//123

【ejs.render(str,data,[option])】

  直接渲染字符串并生成html,参数如下

str:需要解析的字符串模板data:数据option:配置选项
var result = ejs.render('<%=123 %>');console.log(result);//123

  两个函数包括的配置选项参数options如下:

cache 缓存编译后的函数(ejs.compile(..) ,需要 filename参数作为缓存的keyfilename 用于缓存的key,和includecontext 函数的执行上下文compileDebug 输出compile的信息来跟踪调试client 返回编译后的函数delimiter <% .. %> 指这里的%debug 输出ejs.compile()得到函数的函数体strict ejs.compile()返回的函数是否执行在严格模式_with 是否使用 with(){..} 来访问本地变量localsName 保存本地变量的对象名,默认为localsrmWhitespace 移除多余空格

 

常用标签

【js】

  所有使用 <% %> 括起来的内容都会被编译成 Javascript,可以在模版文件中像写js一样Coding

//test.ejs<% var a = 123 %><% console.log(a); %>//test.jsvar ejs = require('ejs');var fs = require('fs');var data = fs.readFileSync('test.ejs');var result = ejs.render(data.toString());console.log(result);//123

  或者,像下面这样写

var ejs = require('ejs');var result = ejs.render('<% var a = 123 %><%console.log(a); %>');console.log(result);//123

【变量】

  用<%=...%>输出变量,变量若包含 '<' '>' '&'等字符会被转义

var ejs = require('ejs');var result = ejs.render('<%=a%>',{a:'
123
'});console.log(result);//<div>123</div>

  如果不希望变量值的内容被转义,那就这么用<%-... %>输出变量

var ejs = require('ejs');var result = ejs.render('<%-a%>',{a:'
123
'});console.log(result);//
123

【注释】

  用<%# some comments %>来注释,不执行不输出

【include】

  include 可以引用绝对路径或相对路径的模板文件

//test.ejs<% var a = 123 %><% console.log(a); %>//test.jsvar ejs = require('ejs');var result = ejs.render('<% include test.ejs %>');//throw new Error('`include` use relative path requires the \'filename\' option.');console.log(result);

  由上面的提示可知,使用相对路径时,必须设置'filename'选项

//test.ejs<% var a = 123 %><% console.log(a); %>//test.jsvar ejs = require('ejs');var result = ejs.render('<% include test.ejs %>',{filename:'test.ejs'});console.log(result);//123

  

缓存

  EJS默认是开启模版缓存。这样在一个页面中多次请求模版文件时,只会请求一次

  可以通过代码设置是否开启缓存:EJS.config({cache: false});//关闭缓存

转载地址:http://bnldl.baihongyu.com/

你可能感兴趣的文章
学习html我们从百度百科开始
查看>>
如何Spring Cloud Zuul作为网关的分布式系统中整合Swagger文档在同一个页面上
查看>>
实现一个炫酷的随机标签排列效果(颜色随机,大小随机,成菱形排列的列表)...
查看>>
flex 布局
查看>>
数字资产交易所开发:平台币快速吸金的背后
查看>>
小程序自定义音频组件,带滚动条,IOS循环失效问题
查看>>
Swift开发之粒子动画的实现
查看>>
我学Java我傲娇
查看>>
挖矿蠕虫肆虐,详解云防火墙如何轻松“制敌”
查看>>
Linux -- Samba之客户端访问(Linux和windows)
查看>>
八个Docker的真实应用场景
查看>>
vpc的使用方法
查看>>
GitExtensions GitCredentialWinStore syntax error near unexpected token `('
查看>>
Java获取EXE文件图标的方法
查看>>
“驱动程序在 \Device\Harddisk0\D 上检测到控制器错误”的根本解决办法!
查看>>
ubuntu 之修改权限的问题
查看>>
php 框架ci去index.php的方法
查看>>
Hyper-v学习(四),SMB虚拟机实时迁移
查看>>
基于spring3注解的google分页
查看>>
实用命令行工具详解—crontab
查看>>