연산, 속성 값

🔷 연산

🔹 산술연산

<ul>
  <li> 1 + 2 = <span th:text="1 + 2"></span></li>
  <li>5 * 10 = <span th:text="5 * 10"></span></li>
  <li>10 % 2 == 0 = <span th:text="10 % 2 == 0"></span></li>
</ul>

🔹 비교연산

<ul>
  <li>1 > 10 = <span th:text="1 &gt; 10"></span></li> // false
  <li>1 gt 10 = <span th:text="1 gt 10"></span></li> // false
  <li>1 >= 10 = <span th:text="1 >= 10"></span></li> // false
  <li>1 ge 10 = <span th:text="1 ge 10"></span></li> // false
  <li>1 == 10 = <span th:text="1 == 10"></span></li> // false, == : eq
  <li>1 != 10 = <span th:text="1 != 10"></span></li> // true, != : neq, ne
  // ! : not
</ul>

🔹 조건식

🔸 자바와 유사함

<li>(10 % 2 == 0) ? '짝수' : '홀수' = <span th:text="(10 % 2 == 0)? '짝수' : '홀수'"></span></li>

🔹 Elvis연산

🔸 조건식을 편리하게 사용할 수 있다.(데이터가 없을 때)

<ul>
<li>${data}?: '데이터가 없습니다.'<span th:text="${data}?: '데이터가 없습니다.'"></span></li>
<li>${nullData}?: '데이터가 없습니다.'<span th:text="${nullData}?: '데이터가 없습니다.'"></span></li>
</ul>

🔹 No-Operation

🔸 조건식에서 값이 _가 되면 타임리프가 태그를 읽지 않는다. -> 데이터가 없습니다 가 출력됨

<ul>
<li>${data}?: _ = <span th:text="${data}?: _">데이터가 없습니다.</span></li>
<li>${nullData}?: _ = <span th:text="${nullData}?: _">데이터가 없습니다.</span></li>
</ul>

🔷 속성 값

🔸 th:* 속성을 사용 -> 기존 속성을 대체(기존 속성이 없을 경우 새로 생성)

🔹속성 설정

<input type="text" name="username" th:name="userA"/>
// name = "userA"로 렌더링 된다.

🔹속성 추가

- th:attrappend : <input type="text" class="text" th:attrappend="class=' large'" /><br/>
// 속성 값 뒤에 값을 추가 : 페이지 소스보기를 하면 class="text large"
- th:attrprepend : <input type="text" class="text" th:attrprepend="class='large '" /><br/>
// 속성 값 앞에 값을 추가 : 페이지 소스보기를 하면 class = "large text"
- th:classappend : <input type="text" class="text" th:classappend="large" /><br/>
// class 속성에 추가 : 페이지 소스보기를 하면 class = "text large"

🔹checked처리

- checked (O) <input type="checkbox" name="active" th:checked="true"><br> //체크됨
- checked (X) <input type="checkbox" name="active" th:checked="false"><br> // 체크안됨
- checked = false <input type="checkbox" name="active" checked="false"><br> // 체크됨
// HTML에서는 checked만 있으면 true/falset 상관없이 체크가 된다.

https://www.inflearn.com/course/스프링-mvc-2/