這節(jié)將會(huì)是模板引擎的第二部分琼懊，由于重感冒的原因阁簸，各位請(qǐng)見(jiàn)諒我的聲音變化（譯者覺(jué)得還挺 sexy，aha）哼丈，目前正在恢復(fù)中启妹，但課程還是需要繼續(xù)。
上節(jié)課我們創(chuàng)建了一個(gè) profile 的模板視圖并嵌入數(shù)據(jù)到視圖當(dāng)中醉旦。
這節(jié)課將介紹一些在視圖上能使用的高級(jí)技巧饶米，不僅僅只是在視圖上輸出數(shù)據(jù)，還可以使用 Javascript 代碼進(jìn)行流程控制等车胡。
這節(jié)課我們將傳遞更多數(shù)據(jù)到視圖里檬输，并循環(huán)里面的數(shù)據(jù)然后輸出:
- 首先我們傳遞數(shù)組到視圖模板中
'app.js'
var express = require('express');
var app = express();
app.get('/profile/:name', function(req, resp){
var data = {
hobbie: ['eating', 'fighting', 'fishing',] // 數(shù)組數(shù)據(jù)
}
resp.render('profile.ejs', {
data: data
});
});
- ejs 里使用流程控制語(yǔ)句遍歷數(shù)組并輸出，跟 ejs 里輸出的語(yǔ)法很相像
<% %>就是不需要=-
<% data.hobbie.forEach(function(item)){%>這是循環(huán)的語(yǔ)法 - 下一行起放 HTML 標(biāo)簽吨拍，并輸出模板引擎?zhèn)鬟f過(guò)來(lái)的參數(shù)
- 最后結(jié)束循環(huán)語(yǔ)法
<% });%>
-
‘profile.ejs’
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>index</title>
</head>
<body>
<ul>
<% data.hobbie.forEach(function(item)){%>
<li><%= item %></li>
<% });%>
</ul>
</body>
</html>
