Tymeleaf 사용하기

AeZan·2021년 9월 13일
0

📌 dependency 추가

<dependency>
      <groupId>org.springframework.boot</groupId>
      <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>

maven 의 경우 pom.xml 에 추가


📌 사용법

<!doctype html>
<html lagn="ko" xmlns:th="http://www.thymeleaf.org">

html 태그 안에 선언


📌 기본 문법

<div th:[속성] = "서버에서 받는 값 및 조건식" />

div 말고도 모든 html 태그 가능


📌 속성

replace

<!-- 공통 헤드-->
<th:block th:replace="fragments/head :: headFragment"></th:block>

href

 <a th:href="@{/templates/calendar/calendar.html}" />

src

<img th:src="@{/static/bootstrap/images/logo.png}" alt="" height="55">

object action

<form th:action="@{/board/create}" method="post" th:object="${board}">

for field (label의 for값과 양식의 id값이 같으면 연결됨)

<label th:for="title">제목</label>
<input th:field="*{title}" id = "title" class="form-control"/>

object로 가져온 객체 내의 데이터를 field를 통해 접근할 수 있음

each

<tr th:each="board : ${boardList}">

text

<td th:text="${#temporals.format(board.createTime, 'yyyy-MM-dd HH:mm:dd')}">

JAVA 8 이상 날짜 API 처리 -> #temporals 사용

#numbers

  • formatInteger(변수, 자릿수, '구분자')
th:text="|${#numbers.formatInteger(overFeedLevel.wastedCost, 3, 'COMMA')}

  • formatDecimal(변수, 정수 자릿수, 소수 자릿수, '구분자')
th:text="|${#numbers.formatDecimal(precisionSpec.production, 0, 0, 'COMMA')} L|"

'구분자' -> 'POINT', 'COMMA', 'WHITESPACE', 'NONE', 'DEFAULT'


📌 변수식

${ } : 컨트롤러에서 전달받은 변수에 접근할 수 있음
@{ } : 서버의 contextPath
*{ } : th:object 로 정의된 변수에 포함된 값

contextPath : 웹어플리케이션을 구분하기 위한 path

@GetMapping("/auth/login")
  public String login() {
    return "auth/login";
  }

0개의 댓글