반응형
◦ 링크 URL 표현식: @{...}
타임리프에서 <a> 태그의 location.href 속성에 많이 사용하는 URL 링크에는 별도의 표현식이 존재한다.
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>URL 링크</h1>
<ul>
<li><a th:href="@{/hello}">basic url</a></li>
<li><a th:href="@{/hello(param1=${param1}, param2=${param2})}">hello queryparam</a></li>
<li><a th:href="@{/hello/{param1}/{param2}(param1=${param1}, param2=${param2})}">path variable</a></li>
<li><a th:href="@{/hello/{param1}(param1=${param1}, param2=${param2})}">path variable + query parameter</a></li>
</ul>
</body>
</html>
- th:href= " @{ ( param1=${param1}, param2=${param2} ) } "
쿼리 파라미터를 붙여주는데 콤마(,)로 구분해 여러 개를 제공할 시 자동적으로 &으로 변환되어진다.
- th:href= " @{ /hello/{param1}( param1=${param1}, param2=${param2} ) } "
이 경우는 param2의 값이 남는데, 남은 param2는 쿼리 파라미터로 넘어가게 된다.
◦ 선택 변수 표현식: *{...}
◦ 메시지 표현식: #{...}
◦ 조각 표현식: ~{...}
• 리터럴
- 소스 코드상에 고정된 값을 말하는 용어이다.
◦ 텍스트: 'one text', 'Another one!',…
- 타임리프에서 문자 리터럴은 항상 '( 작은따옴표)로 감싸야한다.
그런데 항상 작은따옴표로 감싸는 일은 매우 귀찮기 때문에 타임리프에서는 공백 없이 쭉 이어진다면 하나의 의미있는 토큰으로 인지해 작은 따옴표를 생략할 수 있다.
<span th:text="hello world!"><span> 틀린 방법
<span th:text="'hello world!'"><span> 맞는 방법
스페이스로 구분되어 처리되었기 때문에 이어졌다고 볼 수 없기에 에러를 출력한다. 따라서 띄어쓰기, 공백이 있는 경우에는 작은 따옴표로 꼭 감싸야한다.
◦ 숫자: 0, 34, 3.0, 12.3,…
◦ 불린: true, false
◦ 널: null
◦ 리터럴 토큰: one, sometext, main,…
타임리프 연산은 자바와 크게 다르지 않지만 HTML안에서 사용하기 때문에 HTML 엔티티( >, <..)를 사용하는 부분만 주의하자
• 문자 연산:
◦ 문자 합치기: +
◦ 리터럴 대체: |The name is ${name}|
<span th:text="|hello world!|"><span>
기존 리터럴 표현법이 작은따옴표로 구분하고 문자열을 합치기 위해서 + 연산자를 사용했던 거와 달리 대체 문법을 통해 쉽게 사용할 수 있다.
• 산술 연산: ◦ Binary operators: +, -, *, /, %
◦ Minus sign (unary operator): -
<ul>
<li>산술 연산
<ul>
<li>10 + 2 = <span th:text="10 + 2"></span></li>
<li>10 % 2 == 0 = <span th:text="10 % 2 == 0"></span></li>
</ul>
</li>
</ul>
• 비교와 동등:
◦ 비교: >, <, >=, <= (gt, lt, ge, le)
◦ 동등 연산: ==,!= (eq, ne)
<ul>
<li>비교 연산
<ul>
<li>1 > 10 = <span th:text="1 > 10"></span></li>
<li>1 gt 10 = <span th:text="1 gt 10"></span></li>
<li>1 >= 10 = <span th:text="1 >= 10"></span></li>
<li>1 ge 10 = <span th:text="1 ge 10"></span></li>
<li>1 == 10 = <span th:text="1 == 10"></span></li>
<li>1 != 10 = <span th:text="1 != 10"></span></li>
</ul>
</li>
</ul>
• 조건 연산: ◦ If-then: (if)? (then)
◦ If-then-else: (if)? (then) : (else)
◦ Default: (value)?: (defaultvalue)
<ul>
<li>조건식
<ul>
<li>(10 % 2 == 0)? '짝수':'홀수' = <span th:text="(10 % 2 == 0)?'짝수':'홀수'"></span></li>
</ul>
</li>
</ul>
• 특별한 토큰: ◦ No-Operation: _
<ul>
<li>No-Operation
<ul>
<li>${data}?: _ = <span th:text="${data}?: _">데이터가 없습니다.</span></li>
<li>${nullData}?: _ = <span th:text="${nullData}?: _">데이터가없습니다.</span></li>
</ul>
</li>
</ul>
* Elvis연산자 뒤에 _라는 No-Operation이 오는 경우 타임리프 태그가 무시되고 HTML 자체가 출력된다.
반응형
'SSR > Thymeleaf' 카테고리의 다른 글
Thymeleaf (5) (0) | 2022.01.05 |
---|---|
Thymeleaf (4) (0) | 2022.01.05 |
Thymeleaf (3) (0) | 2022.01.04 |
Thymeleaf (1) (0) | 2022.01.03 |
댓글