티스토리 뷰
연산
- 타임리프 연산은 자바와 크게 다르지 않다.
- HTML안에서 사용하기 때문에 HTML 엔티티를 사용하는 부분만 주의하면 된다.
/resources/templates/basic/operation.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<ul>
<!-- 산술 연산 -->
<li>산술 연산
<ul>
<li>10 + 2 = <span th:text="10 + 2"></span></li>
<li>10 % 2 == 0 = <span th:text="10 % 2 == 0"></span></li>
</ul>
</li>
<!-- 비교 연산 -->
<li>비교 연산
<ul>
<li>1 > 10 = <span th:text="1 > 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>
</ul>
</li>
<!-- 조건식 -->
<li>조건식
<ul>
<li>(10 % 2 == 0)? '짝수':'홀수' = <span th:text="(10 % 2 == 0)? '짝수':'홀수'"></span></li>
</ul>
</li>
<!-- Elvis 연산자 -->
<li>Elvis 연산자
<ul>
<li>${data}?: '데이터가 없습니다.' = <span th:text="${data}?: '데이터가 없습니다.'"></span></li>
<li>${nullData}?: '데이터가 없습니다.' = <span th:text="${nullData}?: '데이터가 없습니다.'"></span></li>
</ul>
</li>
<!-- No-Operation -->
<li>No-Operation
<ul>
<li>${data}?: _ = <span th:text="${data}?: _">데이터가 없습니다.</span></li>
<li>${nullData}?: _ = <span th:text="${nullData}?: _">데이터가 없습니다.</span></li>
</ul>
</li>
</ul>
</body>
</html>
부연설명
1. 산술 연산:
(1) 10 + 2 = <span th:text="10 + 2"></span>
: 서버 측에서 10과 2를 더한 결과를 계산하고, 이 결과를 <span> 요소에 표시한다.
(2) 10 % 2 == 0 = <span th:text="10 % 2 == 0"></span>
: 10을 2로 나눈 나머지가 0인지 여부를 계산하고, 이 결과를 <span> 요소에 표시한다.
2. 비교 연산:
- 여러 비교 연산자를 사용하여 두 값을 비교하고, 결과를 <span> 요소에 표시한다.
ex. 1 > 10은 false로 평가되므로 결과는 false로 표시된다..
3. 조건식:
(1) (10 % 2 == 0)? '짝수':'홀수' = <span th:text="(10 % 2 == 0)? '짝수':'홀수'"></span>
: 조건식을 사용하여 10을 2로 나눈 나머지가 0인 경우 "짝수"를, 그렇지 않은 경우 "홀수"를 표시한다.
4. Elvis 연산자:
(1) ${data}?: '데이터가 없습니다.' = <span th:text="${data}?: '데이터가 없습니다.'"></span>
: Elvis 연산자를 사용하여 data 변수가 null인 경우 "데이터가 없습니다."를 표시한다.
(2) ${nullData}?: '데이터가 없습니다.' = <span th:text="${nullData}?
: '데이터가 없습니다.'"></span>: nullData 변수가 null인 경우 "데이터가 없습니다."를 표시한다.
5. No-Operation:
(1) ${data}?: _ = <span th:text="${data}?: _">데이터가 없습니다.</span>
: Elvis 연산자를 사용하여 data 변수가 null인 경우 결과를 표시하지 않는다.
(2) ${nullData}?: _ = <span th:text="${nullData}?: _">데이터가 없습니다.</span>
: nullData 변수가 null인 경우 결과를 표시하지 않는다.
실행 결과
'[개발] - Spring > Thymeleaf' 카테고리의 다른 글
| Thymeleaf (9) 반복 (0) | 2023.11.15 |
|---|---|
| Thymeleaf (8) 속성 값 설정 (0) | 2023.11.14 |
| Thymeleaf (6) 리터럴(Literals) (1) | 2023.11.12 |
| Thymeleaf (5) URL 링크 (0) | 2023.11.10 |
| Thymeleaf (4) 유틸리티 객체와 날짜 (0) | 2023.11.09 |
