215
No
POME.xml
라이브러리 를 등록한다. pome.xml
<!-- 스프링 thymeleaf 라이브러리 템플릿 사용 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
정적인 데이터 즉 변동이 없는 css , images, js 는 static 에 저장한다.
application.properties 에서 jsp
#spring.mvc.view.prefix=/WEB-INF/jsp/
#spring.mvc.view.suffix=.jsp
설정을 제거한다.
1. 자바 jsp 는 모두 제거 한다.
2. thymeleaf 는 정확한 xml 로 인식 되어서 <br> 에 도 <br/> 로 꼭 닫는 태그를 써야 오류가 없다.
3. html xmlns 선언
<html xmlns:th="http://www.thymeleaf.org/">
th 는 thymeleaf 로 xml 선언
4. 이미지 예
<img th:src="@{/images/42.jpg}" width="300px" height="200px;" />
@{ } 정적인 데이터를 넣는다.
동적인 것은 다음과 같이 처리 한다.
<img th:src="@{https://graph.facebook.com/}+${id }+@{/picture}" />
5. session 데이터는 타임리프에서 사용이 안된다.
6. List 형 데이터를 반복으로 출력 할 경우
<!-- each="개별값:집합데이터" -->
<div th:each="post:${feed}">
<b> <span th:text="${post.from.name}"></span></b> <!-- 작성자 -->
<span th:text="${post.message}"></span> <!-- 메시지 -->
<img th:src="${post.picture }" /> <!-- 이미지 -->
<hr/>
</div>
8. include 를 할 경우
include 대상에 th:fragment ="" 로 값을 넣는다. <head></head> 는 아무값이나 된다.
예를 들어 <erer> </erer> 로 아무값을 넣어도 상관없다.
<head th:fragment="header" >
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" type="text/css" th:href="@{/css/my.css}" />
</head>
include
여기서 <meta> 태그도 임의 값이다.
폴더 위치 :: 프래그먼트 값 ::header 값이 위에서 지정한 fragment 값이다.
<meta th:include="/include/header::header" th:remove="tag"></meta>
th:remove="tag" 는 현재 meta 태그를 제거한다는 의미이다.
이것을 사용 하지 안을 경우 불필요한 <meta> </meta> 가 포함되어서 출력 된다.
9. 날짜
<!-- #date.format(날짜, '형식') :타임리프의 내장함수 -->
<span th:text="${#dates.format(post.created_time, 'yyyy-MM-dd HH:mm:ss')}"></span>
댓글 ( 1)
댓글 남기기