[Thymeleaf] 연산

Updated: October 30, 2022

1. 개요

Thymeleaf 연산은 HTML 엔티티를 사용하는 부분 외에는 자바와 비슷하다. 이번에는 Thymeleaf에서 연산하는 방법에 대해 알아보도록 하자.

2. 개발 환경

Java 11
Spring Boot 2.7.5

3. 연산

3-1. 비교연산

> : gt
< : lt
>= : ge
<= : le
! : not
== : eq
!= : neq, ne

3-2. 조건식

자바의 삼항연자와 동일하다.

ex) (10 % 2 == 0) ? '짝수' : '홀수'

3-3. Elvis 연산자

Elvis 연산자는 조건식을 편리하게 사용하기 위한 연산자이다. 값이 없으면 해당 값을 출력하고, 없으면 뒤에 입력한 값을 출력한다.

ex) ${data}?: '데이터가 없습니다.'

3-4. No-Operation

Elvis 연산자에 ‘_‘을 넣으면, 데이터가 없는 경우 타임리프가 실행되지 않는 것처럼 동작한다.

ex) ${nullData}?: _

3-5. 예제 코드

[BasicController.java]

@Controller
@RequestMapping("/basic")
public class BasicController {

    @GetMapping("/literal")
    public String literal(Model model) {
        model.addAttribute("data", "Spring!");
        return "basic/literal";
    }

    @GetMapping("/operation")
    public String operation(Model model) {
        model.addAttribute("nullData", null);
        model.addAttribute("data", "Spring!");
        return "basic/operation";
    }
}

[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 &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>
  </ul>
</li> <li>조건식
  <ul>
    <li>(10 % 2 == 0)? '짝수':'홀수' = <span th:text="(10 % 2 == 0)?'짝수':'홀수'"></span></li> </ul>
</li> <li>Elvis 연산자
  <ul>
    <li>${data}?: '데이터가 없습니다.' = <span th:text="${data}?: '데이터가 없습니다.'"></span></li>
    <li>${nullData}?: '데이터가 없습니다.' = <span th:text="${nullData}?:'데이터가 없습니다.'"></span></li> </ul>
</li>
  <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>

Gwangyong Jeong