반응형

정리(타임리프 - 기본기능)

  • 프로젝트 생성
  • 타임리프 소개
  • 텍스트 - text, utext
    • text는 기본적으로 th:text="${data}" 이렇게 출력해도 되고,
      컨텐츠 안에서 직접 [[${data}]]이렇게 출력해도 된다.
    • 타임리프는 기본적으로 HTML 엔티티로 중복이 되는 기호들(ex <)들은 이스케이프 처리를 한다.
    • 그래서, 언이스케이프를 하려면, utext를 사용하거나, [(...)] 이렇게 사용하면 된다.
  • 변수 - SpringEL
    • object, map, list 등
    • 추가로, with로 지역변수를 선언할 수도 있음.
  • 기본 객체들
    • 타임리프는 기본객체들을 제공한다.
  • 유틸리티 객체와 날짜
    • 타임리프에서 자바8의 날짜는 기본으로 지원하지않고, thymeleaf-extras-javatime 라이브러리를 추가해야 하는데, 스프링 부트를 쓰면 기본으로 추가가 되어 있다.
  • URL 링크
    • 타임리프에서 URL을 생성할 때는 @{...} 문법을 사용하면 된다.
  • 리터럴
    • 리터럴은 소스 코드 상에서 고정된 값을 말하는 용어이다.
    • 리터럴원 원칙상 '로 감싸야 한다.하지만 공백 없이 쭉 이어 진다면 하나의 의미 있는 토큰으로 인지해서 작은따옴표를 생략할 수 있다.
    • 하지만 띄어쓰기가 있으면 하나의 의미있는 토큰으로 인식되지 않아서  '작은따옴표로 감싸야 한다.
    • ex) <span th:text="hello world!"></span> 은 오류!!!
    • <span th:text="'hello world!'"></span> 는 정상!!
    • 그리고, 리터럴 대체 문법을 사용하면 편하다.
    • <span th:text="|hello ${data}|">
  • 연산
    • 비교연산 연산은 자바와 크게 다르지 않다. 다만, HTTP 엔티티를 사용하는 부분은 조심해야 한다.
      >(gt), <(lt), >=(ge), <=(le), !(not), ==(eq), !=(neq, ne)
    • 조건식은 자바의 조건식과 유사하다.
    • Elvis 연산자: 조건식의 편의 버전
    • No-Operation: '_'인 경우 마치 타임리프가 실행되지 않는 것 처럼 동작한다. 이것을 잘 사용하면 HTML의 내용 그대로 활용할 수 있다. 마지막 예를 보면, 데이터가 없습니다. 부분이 그대로 출력된다.
  • 속성 값 설정
    • 타임리프는 주로 HTML 태그에 th:*  속성을 지정하는 방식으로 동작한다. th:*로 속성을 적용하면 기존 속성을 대체한다. 기존 속성이 없으면 새로 만든다.
    • checked, unchecked
  • 반복
    • th:each
    • Stat
  • 조건부 평가
    • if, unless (만족하지 않으면 태그자체를 랜더링하지 않아서 지워진다.
    • switch
  • 주석
    • 표준 HTML 주석 (타임리프는 이것을 그대로 출력되게 놔둔다.
    • 타임리프 파서 주석(타임리프가 HTML을랜더링 하면 다 지워진다.
    • 타임리프 프로토타입(타임리프에서 랜더링 된 경우에만 나타나게 된다.
  • 블록
    • 블록(block)은 일반적으로 쓰는 것은 아니고, 문제가 해결이 잘 안될 때 사용한다.
    • 예를 들어 div2개를 한번에 each돌리고 싶을때 등..
  • 자바스크립트 인라인
    • 타임리프에서 자바스크립트를 쓰는데 그안에 뭔가 타임리프를 넣어줘야하면 자바스크립트 인라인을 쓰자.
      그러면 타임리프가 많은 것을 제공해준다.
    • 1. 타입에 따라서 ""를 넣어준다.
    • 2. 이스케이프 처리를 해준다.
    • 3. 객체의 경우에는 JSON으로 자동으로 변환해준다.
  • 템플릿 조각
  • 템플릿 레이아웃1
  • 템플릿 레이아웃2
  • 정리

 

반응형