EJS 에서 변수 를 받아서 사용하는 폼은 크게 3가지가 있다
<% Something %> 과 <%- Something %> 그리고 <%= Something %> 이다.
이제 부터 이 3가지의 차이점이 무엇인지 하나하나 알아가 보자.
1. <% %>
EJS 에서 <% %> 는 소스내 에서 실행되지만 보이지는 않는 태그이다
무슨 의미냐면 클라이언트 들은 화면에서 보이지 않지만
실행이 되는 태그라는 뜻이다.
<% if(i%2) { %>class="odd"<% } else { %>class="even" <% }%>
위의 소스에서 i 가 짝수면 odd 를 아니라면 even 을 class 값으로 주는 소스이다.여기에서 <% %> 를 이용해서 if 로 조건문을 줄수 있지만 사용자는 보이지 않는다.
2. <%- %>
이 태그는 <% %> 태그와는 조금 다르게 HTML 코드를 날것(Raw)로 보여줍니다
<% something %> 과 <% -something %> 의 차이점은
<% something %> 은 소스에 보이지 않는 흐름제어 태그이고
즉, <%- %> 태그를 이용하면 아래와 같이 HTML 소스를 include 해서 사용이 가능합니다.
update.ejs
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<%- include ./head %>
</head>
head.ejs
<nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav">
<div class="container">
<a class="navbar-brand js-scroll-trigger" href="/">Start Node.js with Express</a>
.
.
.
위의 소스를 보면 알겠지만 html 소스 인 head 파일을 update.ejs 에 include 하였다
3. <%= %>
이 태그는 <%- %> 와 매우 유사하지만 다른점이 있다.
바로 이스케이프 문자를 포함한다 무슨말이냐면
<P>HELLO WORLD</P>
head.html
백날 <%= include ./head %> 와 같은 방법으로 기존의 소스에 추가하려고해도
상상했던대로 <p>HELLO WORLD</p> 가 소스에 삽입 되는것이 아닌 "<p>HELLO WORLD</p>" 와 같이 HTML 소스가 그대로 값으로 들어가져 버린다.
즉, <%= %> 태그는 다른 페이지 에서 받아온 데이터 를 넣어줄때 쓰인다
예를 들면 <input type=text value=""> 라는 소스에 value 값에 title 이라는 데이터를 넣어주고 싶다면 <%- %> 이 아닌
<input type=text value="<%=title%>"> 과 같이 해주면 받아오는 title 값에 따라
value 값이 달라지게 된다.
3줄요약
<% %> 는 흐름제어에 쓰인다 주로 소스내의 분기를 내줄때 쓰인다
<%- %> 는 RAW 한 데이터를 표시해준다(이스케이프 문자 없이) 주로 include 등을 할때 쓰인다
<%= %> 는 이스케이프 문자가 포함되며 주로 다른페이지의 값을 사용할떄 쓰인다
'IT,프로그래밍 > Node.js' 카테고리의 다른 글
| [Node.js] Redirect 를 data 와 함께 보내는법 (0) | 2020.01.22 |
|---|---|
| [Node, express, ejs] i18next 써서 국제화 하기 [2] (5) | 2019.08.16 |
| [Node, express, ejs] i18next 써서 국제화 하기 [1] (1) | 2019.08.16 |
| [Node.js , express, ejs] express + EJS render 할때 json 으로 변수넣기 (0) | 2019.08.05 |
| [Node.js | PHP] php 페이지 와 nodejs 페이지 사이 데이터 전달 (0) | 2019.01.30 |