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

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐