728x90
타임리프 사용 선언
<html xmlns:th = "http://www.thymeleaf.org" lang="en">속성 변경 th:href
<link th:href="@{/css/bootstrap.min.css}"
href="../css/bootstrap.min.css" rel="stylesheet">href="value1" 을 th:href="value2"의 값으로 변경한다.
HTML을 그냥 볼때는 value1으로 뷰 템플릿을 거치게 되면 th의 href로 대체되면서 동적으로 변경 할 수 있다.
URL 링크식 @{...}
th:href="@{/basic/items/{itemId}(itemId=${item.id}, query='test')}".타임리프에서 URL 링크를 사용하는 경우 @{...}를 사용한다.
경로 변수{item.id}뿐만 아니라 쿼리파라미터인 query도 쉽게 가능하다.
리터럴 대체문법 |...|
타임리프에서 문자와 표현식 등은 분리되어 있기 때문에 더해서 사용해야 한다.
(1)리터럴 대체문법을 사용하지 않았을 때
th:onclick="'location.href=' + '\'' + @{/basic/items/add} + '\''"(2)리터럴 대체문법을 사용했을 때
th:onclick="|location.href='@{/basic/items/add}'|"
변수 표현식 ${...}
<td th:text="${item.price}">10000</td>모델에 포함된 값이나,타임리프 변수로 선언한 값을 조회할 수 있다.
내용 변경 th:text
<td th:text="${item.price}">10000</td>내용의 값을 th:text 값으로 변경한다.
10000->item.price
반복 출력 th:each
<tr th:each="item : ${items}">
<td><a href="item.html" th:href="@{|/basic/items/${item.id}|}" th:text="${item.id}">회원id</a></td>
<td><a href="item.html" th:href="@{/basic/items/{itemId}(itemId = ${item.id})}" th:text="${item.itemName}">상품명</a></td>
<td th:text="${item.price}">상품 가격</td>
<td th:text="${item.quantity}">상품 수량</td>
</tr>모델에 포함된 items 컬렉션 데이터가 item 변수에 하나씩 포함되고 반복문 안에서 item변수를 사용 할 수 있다.
컬렉션의 수만큼 <tr>...</tr>이 하위 태그를 포함해서 생성한다.
728x90
'Spring' 카테고리의 다른 글
| Entity Mapping (0) | 2023.03.18 |
|---|---|
| 영속성 컨텍스트의 이점 (0) | 2023.03.16 |
| RedirectAttributes (0) | 2023.03.15 |
| PRG (0) | 2023.03.15 |
| logging (0) | 2023.03.14 |
