Thymeleaf 실무에서 자주 사용하는 것들

모든 소스코드는 여기에서 확인 가능합니다.
잘못된 정보나 기술적 피드백은 적극 환영합니다.🙆‍♂️

오늘은 저번시간에 다룬 간단한 Spring, Thymleaf로 예제를 중심으로 실무에서 자주 사용하는 Thymeleaf를 알아보도록 하겠습니다.

1. 값 자체, Value를 화면에 렌더링 - th:text, th:value

<div th:text="${message}"></div>

모델에 데이터를 담고, 화면에 뿌릴때, 가장 많이 사용하는 th:textth:value

2. Collection 정보 렌더링 - th:each

<tr th:each="item, iter:${items}">
  <td th:text="${item.name}" th:value="${iter.index}">이름값이 없습니다.</td>
  <td th:text="${item.price}" th:value="${iter.index}">가격정보 없습니다.</td>
</tr>

items 라는 list를 받아서, item 각각의 정보를 text로 화면에 뿌립니다. 종종 index정보가 필요한 경우가 있습니다. iter를 통해서 index정보도 얻을 수 있습니다.

3. 조건을 주고 싶을 때 - th:if, th:unless

<!--if else -->
<th:block th:if="${isPurchased}">
  <div>구매함</div>
</th:block>
<th:block th:if="!${isPurchased}">
  <div>구매하지 않음</div>
</th:block>

th:ifth:unless 를 통해서 if else를 나타낼 수 있습니다.

4. 여러개의 Stuat 값으로 정의된 경우 - th:switch

<!--switch case-->
<th:block th:switch="${itemStatus}">
  <div th:case="1" th:text="success"></div>
  <div th:case="2" th:text="fail"></div>
  <div th:case="3" th:text="pending"></div>
</th:block>

th:switch 로 switch case 구문도 나타낼 수 있습니다.

5. 객체를 분할? - th:object 객체의 attribute에 접근하기

<div th:object="${userInfo.user}">
  <div th:text="*{firstName}"></div>
  <div th:text="*{lastName}"></div>
  <div th:text="*{city}"></div>
</div>

userInfo 객체 안에 user 객체의 attribute에 접근할 때는 다음과 같이 사용할 수 있습니다.

<div th:text="${userInfo.user.firstName}"></div>
<div th:text="${userInfo.user.lastName}"></div>
<div th:text="${userInfo.user.city}"></div>

위에랑 정확히 동일한 표현 방법입니다.

6. 내장된 함수 사용하기 - 계산식

1. numbers.sequence

<ul th:each="num: ${#numbers.sequence(1,5)}">
  <li th:text="${num}"></li>
</ul>

sequential 하게 숫자를 만들고 싶으면, 다음과 같이 #numbers라는 이미 정의해놓은 함수들을 사용할 수 있습니다.

2. Collection

<span
  >총 아이템:
  <div th:text="${#lists.size(items)}"></div
></span>

아이템의 총 size도 측정할 수 있는 utils를 제공해줍니다.

3. 합계(통계)

<td th:text="${#aggregates.sum(o.orderLines.{purchasePrice * amount})}">
  23.32
</td>

4. 날짜 정보

<div
  th:text="${#calendars.format(#calendars.createNow(), 'yyyy-MM-dd HH:mm')}"
></div>

#calendars를 통해서 날짜도 화면에 렌더링할 수 있습니다.

Expression Utility Objects에 관한 더 많은 정보는 여기에서 확인 바랍니다.

정리

오늘은 view template engine인 Thymeleaf 기본적으로 실무에서 많이? 자주 사용하는 것들에 대해서 알아보았습니다.

연관 포스트