Devleop/Thymeleaf

[Thymeleaf] 타임리프 리터럴(literals)과 연산(>, +, Elvis, No-Operation)

hwajae 2023. 5. 17. 11:04
반응형

타임리프

리터럴

소스 코드상에 고정된 값을 말하는 용어

문자 'Hello'
숫자 10
Boolean true, false
null null

 

문자 리터럴

항상 작은 따옴표 (')로 감싸야한다. 하지만 공백 없이 쭉 이어진다면 하나의 의미있는 토큰으로 인식하여 아래와 같이 따옴표를 생략할 수 있다. (A-Z , a-z , 0-9 , [] ,. , - , _)

<span th:text="'hello'">

<span th:text="hello">

 

리터럴 대체 (Litreal substitutions)

|...| 기호를 이용해서도 가능하다. 

<span th:text="|hello ${data}|">

연산 (>, +, Elvis, No-Operation)

 

타임리프 연산은 자바와 크게 다르지 않다. HTML 안에서 사용되기 때문에 엔티티 사용 부분은 주의해야 한다.

 

산술연산

<li>10 + 2 = <span th:text="10 + 2"></span></li>
<li>10 % 2 == 0 = <span th:text="10 % 2 == 0"></span></li>

 

비교 연산

HTML 엔티티 사용해야 하는 부분을 주의해서 작성한다. 

 <li>1 > 10 = <span th:text="1 &gt; 10"></span></li>
 <li>1 gt 10 = <span th:text="1 gt 10"></span></li>
 <li>1 >= 10 = <span th:text="1 >= 10"></span></li>
 <li>1 ge 10 = <span th:text="1 ge 10"></span></li>
 <li>1 == 10 = <span th:text="1 == 10"></span></li>
 <li>1 != 10 = <span th:text="1 != 10"></span></li>

 

조건 연산

자바의 조건식과 유사하다.

<li>(10 % 2 == 0)? '짝수':'홀수' = <span th:text="(10 % 2 == 0)? '짝수':'홀수'"></span></li>

 

Elvis 연산자

위의 조건식의 편의 버전, Model에 data가 담겨있다면 해당 data가 나오고 없다면 데이터가 없습니다가 출력이 된다. 

<li>${data}?: '데이터가 없습니다.' = <span th:text="${data}?: '데이터가 없습니다.'"></span></li>
<li>${nullData}?: '데이터가 없습니다.' = <span th:text="${nullData}?: '데이터가 없습니다.'"></span></li>

 

No-Operation

data에 null 값이 들어간다면 그대로 html에 있는 데이터가 없습니다가 출력이 된다. 이것을 이용하면 HTML의 내용을 그대로 이용할 수 있다는 장점이 있다. 

<li>${data}?: _ = <span th:text="${data}?: _">데이터가 없습니다.</span></li>
<li>${nullData}?: _ = <span th:text="${nullData}?: _">데이터가 없습니다.</span></li>

출처 : https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81-mvc-2/dashboard

 

스프링 MVC 2편 - 백엔드 웹 개발 활용 기술 - 인프런 | 강의

웹 애플리케이션 개발에 필요한 모든 웹 기술을 기초부터 이해하고, 완성할 수 있습니다. MVC 2편에서는 MVC 1편의 핵심 원리와 구조 위에 실무 웹 개발에 필요한 모든 활용 기술들을 학습할 수 있

www.inflearn.com

 

반응형