[Thymeleaf] if - else 사용하기

반응형

thymeleaf, if - else 사용하기

 

 

 

 

 1  -  if 사용하기

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>if문 이용하기</h3>

<!-- Java에서 value의 값은 10으로 가져온다 -->
<h5 th:text="'value의 값은 '+${value}+ '이다' ">value의 값은 5다.</h5>
<h5 th:if="${value>5}">value가 5보다 크다</h5>

</body>
</html>

if문 사용시 결과

 언어의 기본, if문이다.

th:if를 통해 실행되며, ${} 괄호 안에서 조건값을 적는 것이 특징이다.

 

if문의 조건이 true일 경우, 태그가 실행된다.

if문의 조건이 false일 경우, 태그는 실행되지 않는다.

 

 

여기까지는 다른 언어와 비슷하지만, else의 경우 특이한 경우가 있었다.

 

 

  2  -  if ~ else 실행하기

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>if문 이용하기</h3>

<th:block th:with="value=10">
    <h5>value의 값은 10이다.</h5>
    <h5 th:if="${value>8}">value가 5보다 크다</h5>
    <h5 th:unless="${value>8}">value가 5보다 작다</h5>

    <h5 th:if="${value>1}">02 if test</h5>
    <h5 th:if="${value>2}">03 if test</h5>

    <h5 th:if="${value<5}">02 출력 될까?</h5>
    <h5 th:unless="${value>5}">02 unless</h5>

    <h5 th:unless="${value <9}">unless는 not과 동일한가?</h5>
</th:block>

</body>
</html>

if - else 사용방법

 if와 다르게 else는 unless로 표현이 되었다.

차이점은 else라고 표현하기보다는 if의 not, false이라고 생각하는 것이 바람직하다.

 

 

1) th:if와 th:unless는 서로 같은 조건을 가진 것이 짝꿍이다.

2) th:if는 별도로 사용할 수 있다.

3) th:if와 th:unless는 서로 다른 조건을 가졌어도 사용할 수 있다.

4) th:unless만 별도로 사용할 수 있다.

 

 

여기서 유심히 봐야 할 부분은 아무래도 4) 부분이라고 생각된다.

<h5 th:unless="${value <9}">unless는 not과 동일한가?</h5>

위의 th:if와 별개로 unless만 별도로 꺼냈고, th:unless는 조건 값이 false가 되자 태그가 실행된 것을 확인할 수 있었다.

 

 

결론은, th:if와 th:unless는 반드시 함께하는 사이가 아니다.

thymeleaf는 if와 else대신 th:if와 th:unless를 사용하므로 1)의 결과처럼 th:if와 th:unless의 조건값을 동일하게 만들어서 if - else의 기능을 수행하고 있었다.

 

 

But, 이렇게 된다면 if - else if - else 중에서 else if 사용하기가 매우 불편하다.

이 점을 감안하여 사용하거나 혹은 switch문을 이용하는 것도 현명하다고 생각된다.

 

 

  3  -  if 문 조건값 2개 이상 사용하기

<h5 th:if="${value>5 and true }">value가 5보다 크다</h5>
<h5 th:if="${value>5 && true }">value가 5보다 크다</h5>

 이 부분은 간단해서 코드만 작성하였다.

 

다른 언어와 마찬가지로 and, or, &&, ||을 사용하였다. 

and , && 은 2개의 조건이 있을 때, 2개 모두 참일 경우 true이다.

or, || 은 2개 이상의 조건이 있을 때, 2개 중 1개라도 참일 경우 true이다.

 

 

  4  -  삼항 연산자

<th:block th:with="value='Y'">
    <h3 th:text="${value} == 'Y'? 'YES': 'NO'"></h3>
</th:block>

결과는 true

 if문의 단골 요소 중 하나인 삼항 연산자이다.

다른 언어처럼 value의 값 대신 if문이 자리 잡아서 기존의 결과가 true와 false여부를 통해 결괏값을 변경하는 기능이다.

 

thymeleaf 또한 마찬가지로 value값 대신에 if문이 들어선다.

 

?을 기준으로 좌측 값의 조건값이 true일 경우, :(클론)을 기준으로 true(좌측), false(우측)으로 구분된다.

 

 

 

  기타

 이전 글의 value가 없어도 태그만 실행되는 현상이 있었다.

마찬가지로 th:if 또한 결과가 false일 경우, 태그의 존재 유무를 판단하였고 다행히도 조건값이 false일 경우 실행되지 않았다.

반응형

'Web > Thymeleaf' 카테고리의 다른 글

[Thymeleaf] template 기능 - replace  (0) 2022.03.23
[Thymeleaf] for 사용하기  (1) 2022.03.08
[Thymeleaf] with 사용하기  (0) 2022.03.07
[Thymeleaf] Value 사용하기  (0) 2022.03.07
[Thymeleaf] Thymeleaf 사용하기  (0) 2022.03.07

댓글

Designed by JB FACTORY