Koa中ejs模板的使用

要想在Koa中使用ejs模板渲染网页，还需要koa-views 配合才行，下面请看详细步骤。

安装koa-views 和 ejs

npm install --save koa-views

npm install ejs --save

引入 koa-views 配置中间件

//引入
const Koa = require('koa')
const path = require('path')
const views = require('koa-views')
const app = new Koa()

//配置需要渲染的文件路径及文件后缀
// app.use(views('views',{map:{html:'ejs'}})); // 模板后缀名是ejs,与下面写法不同，map和extension效果一样的,但是map写法，模板的后缀名是xxx.html，extension写法的后缀名是xxx.ejs
app.use(views(path.join(__dirname,'./view'),{
    extension:'ejs'
}))

Koa中使用ejs

// 写一个中间件配置公共的信息，可以在全站模板内直接调用
app.use(async (ctx,next)=>{
  ctx.state.userinfo = '较瘦';
  await next();  //继续向下匹配路由
});

//render参数1：要渲染的ejs文件名，参2：需要传递的变量
app.use(async(ctx)=>{
    let title = 'hello lval'
    await ctx.render('index',{title})
})

Ejs 引入外部的ejs模板

<%-includeheader.ejs%>

ejs语法

输出：
在页面中输出变量值，你可以这么用：

<div><%= var01 %></div>

如果不希望变量值的内容被转义，那就这么用：

<div><%- var02 %></div>

模块的逻辑支持：
所有使用 <% %> 括起来的内容都会被编译成 Javascript，你可以在模版文件中像写 js 一样 Coding，也允许你声明变量，作用域就是当前模版，因为一个模版会被编译成一个 Javascript 函数。

<ul>
    <% for(var i = 0; i < 10; i++) {%>
    <li>item  <%-i %></li>
    <% } %>
<ul>

1. ejs 绑定数据
 
<%= title %>
 
2. ejs 绑定html数据
 
<%- htmlString %>
 
3. ejs 判断语句
 
<% if (num > 20){ %>
   <div> true </div>
<% }else{ %>
   <div> false </div>
<% } %>
 
4. ejs 循环数据 
 
<% for(var i=0;i<list.length;i++){ %>
    <li><%= list[i] %></li>
<% } %>
 
5. ejs 引入组件
 
<% include public/header.ejs %>