참고
더보기
Spring Boot & Thymeleaf 시리즈는 김영한 님의 "스프링 MVC 2편 - 백엔드 웹 개발 활용 기술" 강의를 정리한 글입니다. 글에 첨부된 사진은 해당 강의의 강의 자료에서 캡쳐한 것입니다. 제 Github에만 올려뒀다가, 정보 공유와 강의 홍보(?)를 위해 블로그에도 업로드합니다.
스프링 MVC 2편 - 백엔드 웹 개발 활용 기술 - 인프런 | 강의
웹 애플리케이션 개발에 필요한 모든 웹 기술을 기초부터 이해하고, 완성할 수 있습니다. MVC 2편에서는 MVC 1편의 핵심 원리와 구조 위에 실무 웹 개발에 필요한 모든 활용 기술들을 학습할 수 있
www.inflearn.com
마크다운 형식으로 작성한 글을 블로그에 다시 올리는 거라 가독성이 많이 떨어집니다. 조금더 편하게 보시려면 아래의 Github repository에서 보시면 됩니다.
GitHub - Kloong1/TIL: Today I Learned.
Today I Learned. Contribute to Kloong1/TIL development by creating an account on GitHub.
github.com
타임리프 - Block 태그
<th:block> 은 HTML 태그가 아닌 타임리프의 유일한 자체 태그이다. 타임리프는 일반적으로 태그의 속성을 기반으로 동작하기 때문에 제약이 생기는 경우가 있다. 그 제약을 해결하기 위해 th:block 태그를 사용할 수 있다.
BasicController.java 내용 추가
package kloong.thymeleaf.basic;
import ... //생략
@Controller
@RequestMapping("/basic")
public class BasicController {
@GetMapping("/block")
public String block(Model model) {
addUsers(model);
return "basic/block";
}
private void addUsers(Model model) {
List<User> list = new ArrayList<>();
list.add(new User("userA", 10));
list.add(new User("userB", 20));
list.add(new User("userC", 30));
model.addAttribute("users", list);
}
}/resources/templates/basic/block.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<th:block th:each="user : ${users}">
<div>
사용자 이름:<span th:text="${user.username}"></span>
사용자 나이:<span th:text="${user.age}"></span>
</div>
<div>
요약:<span th:text="${user.username} + ' / ' + ${user.age}"></span>
</div>
</th:block>
</body>
</html>렌더링 결과 (웹 브라우저 소스 보기)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
사용자 이름:<span>userA</span>
사용자 나이:<span>10</span>
</div>
<div>
요약:<span>userA / 10</span>
</div>
<div>
사용자 이름:<span>userB</span>
사용자 나이:<span>20</span>
</div>
<div>
요약:<span>userB / 20</span>
</div>
<div>
사용자 이름:<span>userC</span>
사용자 나이:<span>30</span>
</div>
<div>
요약:<span>userC / 30</span>
</div>
</body>
</html><th:block>
- 타임리프의 특성상 HTML 태그안에 속성으로 기능을 정의해서 사용하는데, 위 예처럼 한 태그 안에서 속성만으로 기능을 정의하기가 애매한 경우에 사용할 수 있다.
<th:block>태그는 렌더링 시 제거된다.- 위 HTML 에서는
th:each를 여러<div>에 적용시키기 위해th:block을 사용했다. - 특별한 경우 외에는 사용을 지양하는 것이 좋다고 한다.
'Spring > Spring Boot & Thymeleaf' 카테고리의 다른 글
| [Spring Boot & Thymeleaf] 15. 템플릿 조각 (0) | 2022.10.24 |
|---|---|
| [Spring Boot & Thymeleaf] 14. 자바스크립트 인라인(Javascript Inline) (0) | 2022.10.24 |
| [Spring Boot & Thymeleaf] 12. 주석 (0) | 2022.10.24 |
| [Spring Boot & Thymeleaf] 11. if, unless, switch (0) | 2022.10.24 |
| [Spring Boot & Thymeleaf] 10. 반복 (0) | 2022.10.24 |
댓글