template使用

首先,下载并引入template.js模板引擎。

html页面

<div id='app'></div>

<script src='template.js'></script>//引入时注意你的路径

设置模板引擎,必须将type设置成"text/html",id 必须设置名字可以随意

<script type="text/html" id="tem">

<h1>{{message}}</h1>

<p>{{user.name}}</p>

<p>{{user.age}}</p>

<p>{{user.gender === 0 ? '女' :'男'}}</p>

<ul>

{{each}}

<li>

{{$value.todos}}

</li>

{{/each}}

</ul>

</script>

<script>

$.ajax({
url: '/',
type: 'get',
data: taskArr,
success: function (data) {

var html=template('tem',data)

document.getElementById('app').innerHTML=html

}
})

</script>

db.json//存放的数据

[{

message:'hello',

user:{

name:'zs',

age:18,

gender:0

},

todos:['吃饭','睡觉','打豆豆']

}

]

js页面

const express = require('express')
// 接收json数据
const db = require('./db')
const app = express()
// 启动端口
app.listen(3000, () => console.log('Serve listening http://127.0.0.1:3000/'))
// 处理静态资源
app.use('/public', express.static(__dirname + '/public/'))
// 渲染页面
app.get('/', function (req, res) {
let data = require(__dirname + '/db.json')
res.render(__dirname + '/views/index.html', {
taskArr: data[0]
})
})
原文地址:https://www.cnblogs.com/lljun/p/11305884.html