[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