本文主要是介绍【 Node 】EJS模板引擎,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
简介
高效的嵌入式 JavaScript 模板引擎。
安装
npm install ejs
配置视图引擎
app.set('view engine', 'ejs')
基本使用
// 引入express框架
const express = require('express')
// 实例化express对象
const app = express()// 配置视图引擎 ('默认格式','模板引擎')
app.set('view engine', 'ejs')// res.send('传输纯文本信息')// res.sendFile('传输文件')// 渲染ejs模板引擎 res.render('<ejs文件名>',配置一些对象方便后面取值)// res.render('profile', { name: "EJS" })// 根据请求地址返回对应的数据
app.get('/', (req, res) => {console.log(req.url);res.sendFile(__dirname + '/public/index.html')
})app.get('/about', (req, res) => {res.sendFile(__dirname + '/public/about.html')
})app.get('/contact', (req, res) => {res.sendFile(__dirname + '/public/contact.html')
})// 路由参数 /xxx/:<自定义>
app.get('/profile/:id', (req, res) => {// res.send('您所访问的路由参数为:' + req.params.id)// 渲染ejs模板引擎res.render('profile', {name: "EJS"})
})// 监听端口
app.listen(5000)
console.log(__dirname); // D:\Study\Node
EJS使用
// 渲染ejs模板引擎
res.render('profile', {websiteName: req.params.id,data: data
})
// 数据和显示数据代码如下所示
- 单个数据对象
var data = {name:"EJS"
}<ul><li>姓名:<%= data.name %></li>
</ul>
- 多个数据对象
var data = [{name: 'Bucky',age: 25},{name: 'Ketty',age: 26}, {name: 'Henry',age: 27}
]<ul>// 逻辑处理部分 不需要设置等号<% data.forEach(item=>{%><li>姓名:<%= item.name%></li><li>年龄: <%= item.age%></li><% }) %>
</ul>
- 对象嵌套
var data = [{name: ['Bucky', 'Summer', 'God', 'Bongo'],age: 25},{name: ['Ketty', 'John', 'Today'],age: 26}, {name: ['Henry', 'Sun'],age: 27}
]<ul><% data.forEach(item=>{%>// 第一次循环 获取的是全部的name数组里面的名字<li>姓名:<%= item.name%></li>// 对name里面的数组进行循环 items就是获得的单个的数组元素name<% item.name.forEach(items=>{%><li>姓名:<%=items%></li><% })%><li>年龄:<%=item.age%></li><% })%>
</ul>
这篇关于【 Node 】EJS模板引擎的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!