7. 익스프레스 (4) - 템플릿 엔진 : Pug 6

 

 

 

앞서서 이스케이핑에 대해서도 살펴보았는데, 참고삼아 HTML 엔티티에 대해서도 살펴보겠습니다. 자바스크립트 등에서 특수 문자를 사용했는데 이것을 HTML 태그로 오인해 에러가 발생하는 것을 방지하기 위해서, 특수 문자를 HTML 엔티티 코드로 변환하게 됩니다. 

 

< : &lt;

> : &gt;

& : &amp;

띄어쓰기 : &nbsp;

" : &quot;

' : &apos;

 

 

---

 

 

 

○ 반복문 

 

HTML과 다르게 반복문도 사용 가능합니다(반복 가능한 변수일 경우 해당). each를 사용해 다음과 같이 반복문을 사용이 가능합니다. 물론 for를 대신 사용해도 됩니다.

 

 

[HTML]

<ul>
    <li>사과</li>
    <li>배</li>
    <li>오렌지</li>
    <li>바나나</li>
    <li>복숭아</li>
</ul>

 

 

[Pug]

ul
    each fruit in ['사과', '배', '오렌지', '바나나', '복숭아']
        li= fruit

 

 

여기서는 인덱스도 가져올 수 있습니다. 

 

 

<ul>
    <li>1번째 사과</li>
    <li>2번째 배</li>
    <li>3번째 오렌지</li>
    <li>4번째 바나나</li>
    <li>5번째 복숭아</li>
</ul>

 

 

ul
    each fruit in ['사과', '배', '오렌지', '바나나', '복숭아']
        li= (index + 1) + '번째 ' + fruit