스프링 타임리프(Thymleaf) 한눈에 정리하기

 

타임리프를 사용하기전에 확인해야할 정보

 

 

1.타임리프 의존성이 제대로 주입되고 있는지 확인한다.

 

타임리프를 '제대로' 쓰려면  시작하기전에 타임리프가 제대로 설치되어있는지 확인하자.

 

 

2. Model에 대한 개념

 

 

스프링의 MVC 패턴이 여기서도 쓰인다.

 

타임리프는  View 와 Controller의 사이를 '동적'으로 연결해주는데  View의 정보를 Model에서 가져온다.

 

정보를 가져올때 Model의  'attributeName'을 통해 정보를 불러온다.

 

 

3.HTML태그 탄에  xmlns링크 걸어주기

 

 

모든 준비가 마쳤으면 이제 제대로 알아봅시다.

--------------------------------------------------------------------------------------------------------

 

 

1.타임리프 변수명 추출 : ${속성}

타임리프에서 Model에서 값을 가져오려면 "$" 문법을 쓴다. 

 

 

변수가아닌  객체, 리스트 , 맵 과같은 자료구조도 뽑아올수가있다.  뽑아오는 방법은 여러가지가 있지만,

제일 첫번째 문법이 가장 편리해보인다.

 

 

타임리프는 또한 여러가지 편의 객체 기능을 지원해준다.

 

1. 파라미터 불러오기

 

간단하게 예시를 하나 들어보자.  localehost:8080/paramData="HelloParam"  이란 주소가있다 생각하자

 

타임리프는 이런 주소의 있는 파라미터값을  ${param.파라미터이름} 으로 파라미터 값을 불러올 수 있다

 

2.세션값 받아오기

 

파라미터와 동일하게 세션값도 받아올수있다.

 

3.Bean 객체 불러오기

Bean 객체도 역시 불러올수있다.

 

 

2.타임리프 하이퍼링크 : @속성

 

 

타임리프에선 하이퍼링크를 걸기위해선 @문법을 사용한다.

 

링크를 걸땐 절대경로,  상대경로가 있다.

 

/로 시작하면 절대경로로 시작하고,   /로 시작하지않으면 상대경로로 들어간다.

절대경로: 처음부터 URL 경로를 작성

상대경로: 현재 URL에 추가로 경로를 작성

 

파라미터 경로를 받을때도 2가지경우가있다.

 

1. 쿼리로 받기

EX)  localhost:8080/?param1=1234 처럼 파라미터를 넘겨주고싶다면,

@{/(parma1=#{parma1})} 을 작성하자.

 

2.경로값으로 받기

 

EX) localehost:8080/{param1} 처럼 쿼리를안쓰고 값을 경로로 적고싶다면,

@{/{param1}} 처럼 작성하자.

 

3.쿼리+경로 값으로 받기

EX) localehost:8080/{param1}/?param2="data"

th:href="@{/hello/{param1}(param1=${param1}, param2=${param2})}"

 

 

3.타임리프 리터럴 : | |

 

 

리터럴은  문자열과 문자열을 합치는 과정을 간단하게 정리해서 보여준다.

 

원래 문자열과 문자열을 합칠때 '' + '' 와같은 번거로운 연산자를 적어야하지만

 

리터럴을 사용하면 간단하게 문자열을 합칠수있다.

 

 

4.타임리프 연산

 

5.타임리프 반복 : th:each

 

여러개의 데이터를 출력하려면  th:each 를 사용한다.

each문 안에는 "data: ${리스트}"를 담아서 쓴다.

 

 

6.타임리프 if ,Unless

타임리프엔  if, unless, switch  기능이 존재한다. 사용법은  th:each와 유사하다.

 

 

 

7.타임리프 레이아웃 기능 : th:fragment

th:fragment 기능은  조각처럼 계속 재활용할 뷰를 저장해놨다가, 다시 재활용해서 사용하는기능이다.

 

fragment를 끌어서 가져올때는 insert나 replace를 사용한다.

 

insert를 사용하면  자동으로 <div>태그가 감싸져서오고, replace를 사용하면 div태그가 추가되지 않는다.

 

문법은 "~{경로 :: fragment 속성}" 을 사용한다.