EJS 是一套简单的模板语言,帮你利用普通的 JavaScript 代码将 json 数据 生成 HTML 页面

安装: npm i ejs

配置:在入口app.js中添加

app.set("view engine","ejs"); //将ejs设置为express默认的模板引擎语言。

案例:实现/student路由,将学生json数据渲染到网页中

router.get("/student",(req,res)=>{
  let data={
    title:"班级",
    list:[
      {id:1,name:"张三",sex:"男",age:22},
      {id:2,name:"李四",sex:"女",age:12},
      {id:3,name:"王武",sex:"男",age:20},
    ]
  }
  res.render("list.ejs",data)
})

ejs模板存在views文件夹中

  <h2><%= title %></h2>
  <table>
    <tr>
      <th>ID</th>
      <th>姓名</th>
      <th>性别</th>
      <th>年龄</th>
    </tr>
    <tbody>
      <% for(let item of list){ %>
      <tr>
        <td><%= item.id %></td>
        <td><%= item.name %></td>
        <td><%= item.sex %></td>
        <td><%= item.age %></td>
      </tr>
      <% } %>
    </tbody>
  </table>

最后结果为:

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐