nodejs express template (모드) 사용 (ejs + express)
9623 단어 template
var express = require("express")
var app = express();
// ejs html 。 ， .ejs ， // .html
app.engine('.html', require('ejs').__express);
// .html, res.Render("xx.html")
app.set('view engine', 'html');
// ,__dirname ,
app.set('views', __dirname + '/views');
app.use(express.static(__dirname + '/public'));
var users = [
{name: 'tobi', email: '[email protected]'},
{name: 'loki', email: '[email protected]'},
{name: 'jane', email: '[email protected]'}
];
app.get('/', function(req, res) {
// ， ，
res.render('users', {
users: users,
title: "EJS example",
header: "Some users"
});
});
if (!module.parent) {
app.listen(3000);
console.log('Express app started on port 3000');
}
//user.html
<% include header.html %>
<h1>Users</h1>
<ul id="users">
<% users.forEach(function(user){ %>
<li><%= user.name %> <<%= user.email %>></li>
<% }) %>
</ul>
<hr/>
<script>
avalon.define("test", function(vm){
vm.users = <%- JSON.stringify(users) %>
})
</script>
<ul ms-each-el="users" ms-controller="test">
<li>{{el.name}} <{{el.email}}></li>
</ul>
<% include footer.html %>
//header.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> <%= title %> </title>
<script src="avalon.js"></script>
<style type="text/css">
body {
padding: 50px;
font: 13px Helvetica, Arial, sans-serif;
}
</style>
</head>
<body>
//footer.html
</body>
</html>
1. 위 는 express 가 모델 을 사용 하 는 기본 적 인 예 이다.
app.set("view engine","ejs"); 이 문장 은 모형 엔진 을 ejs http://github.com/visionmedia/ejs 로 설정 합 니 다.
ejs 는 npm install ejs 를 통 해 설치 할 수 있 습 니 다.
2. app. get 에서.
res.render('users', { users: users, title: "EJS example", header: "Some users" }); 2 단계 가 실 행 됩 니 다.
3. 2 에서 기본 layot. ejs 를 사용 하지 않 으 려 면 스스로 지정 할 수 있 습 니 다.예 를 들 면:
res.render("index",{"title":"test","layout":"main"});혹시
res.render("index",{"title":"test","layout":"main.ejs"});4. layot 를 사용 하지 않 으 려 면 layot 를 false 로 설정 할 수 있 습 니 다. 예 를 들 어:
res.render("index",{"layout":false});5. 모든 요청 을 따로 설정 하지 않 으 려 면.전역 설정 사용 가능:
app.set("view options",{
"layout":false
});6. ejs 에서 기본 닫 기 표 시 는 <% 입 니 다. .. %>，우리 도 자신의 라벨 을 정의 할 수 있다.예 를 들 면:
app.set("view options",{
"open":"{{",
"close":"}}"
});7. 모든 모델 엔진 의 용법 은 공통점 과 차이 가 있 고 전체적인 사용 방법 은 위 와 같다.
다음은 현재 자주 사용 되 는 모델 엔진 입 니 다.
Template Engines
Below are a few template engines commonly used with Express:
8. 웹 애플 리 케 이 션 에서 특정한 내용 을 반복 적 으로 표시 해 야 합 니 다. 예 를 들 어 사용자 댓 글 기능 은 모든 사용자 의 댓 글 을 반복 적 으로 표시 해 야 합 니 다. 이 럴 때 저 희 는 순환 을 통 해 이 루어 질 수 있 습 니 다.그러나 [부분 모드] (parial) 를 사용 하여 실현 할 수 있 습 니 다.예 를 들 면:
<div class="comment_item">
<div class="comment_user"><%=comment.user%></div> :
<div class="comment_content"><%=comment.content%></div>
</div>this is <%=title%>!
<br/>
<%- partial("comment",comments)%>var app=require("express").createServer();
app.set("view engine","ejs");
app.get("/",function(req,res){
res.render("index",{"title":"test","layout":false,"comments":[
{"user":"gainover","content":"test1"},
{"user":"zongzi","content":"test2"},
{"user":"maomao","content":"test3"}
]});
});
app.listen(3000);<div class="comment_item<%if(firstInCollection){%> firtitem <%}%>">
<div class="comment_user"><%=comment.user%></div> :
<div class="comment_content"><%=comment.content%></div>
</div><% = users% > 는 내용 을 전의 합 니 다. 의 미 를 바 꾸 고 싶 지 않 으 면 <% - users% > 를 사용 할 수 있 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Visual studio 2017에서 빨리 파이썬을 코딩<<준비>> VS2017에서 Raspberry PI에 액세스할 수 있도록 한다. /etc/samba/smb.conf에 추가 /etc/samba/smb.conf samba 재부팅 새 프로젝트에서 템플릿 Bottle 웹...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
