express-art-template模板引擎

模板引擎

  • 为了是art-template模板引擎能够更好的和express框架配合, 模板引擎官方在原art-template模板引擎的基础上封装了express-art-template
  • 使用npm i art-template express-art-template命令进行安装
const express = require('express')
const path = require('path')

const app = express()

// 1. 告诉express框架使用什么模板引擎渲染什么后缀的模板文件
// 1. 模板后缀
// 2. 使用的模板渲染
app.engine('art', require('express-art-template'))
// 2. 告诉express框架模板存放的位置是什么
app.set('views', path.join(__dirname, 'views'))
// 3. 告诉express框架模板的默认后缀是什么
app.set('view engine', 'art')

app.get('/index', (req, res) => {
  // 渲染模板
  res.render('index', {
    msg: 'message'
  })
})

app.listen(3000, () => console.log('running...'))

2. app.locals 对象

将变量设置到app.locals对象下面, 这个数据在所有的模板中都可以获取到

const express = require('express')
const path = require('path')

const app = express()

app.engine('art', require('express-art-template'))
app.set('views', path.join(__dirname, 'views'))
app.set('view engine', 'art')

app.locals.users = [{
  name: 'zhangsan',
  age: 18
}]

app.get('/index', (req, res) => {
  res.render('index', {
    msg: 'message'
  })
})

app.listen(3000, () => console.log('running...'))

  • index.art
{{ msg }}

<ul>
  {{ each users }}
    <li>
      {{ $value.name }}
      {{ $value.age }}
    </li>
  {{ /each }}
</ul>

猜你喜欢

转载自blog.csdn.net/weixin_47085255/article/details/107500103