Thymeleaf 기본 문법

th:text

화면에 값을 출력할 때 사용

<span th:text="${nickname}"></span>

th:if

조건문처럼 사용 한다. 해당 조건이 만족할 때만 보여준다.

    <div th:if="${error}">
        <p>에러 발생</p>
    </div>

th:errors

해당 value의 error가 있는 경우 출력한다.

<ul>
    <li th:errors="*{id}" />
    <li th:errors="*{name}" />
</ul>

form의 validation error를 출력할 때 사용할 수 있다.

	   <form class="needs-validation col-sm-6" action="#"
                  th:action="@{/sign-up}" th:object="${signUpForm}" method="post" novalidate>
                <div class="form-group">
                    <label for="nickname">닉네임</label>
                    <input id="nickname" type="text" th:field="*{nickname}" class="form-control"
                           placeholder="junseo" aria-describedby="nicknameHelp" required minlength="3" maxlength="20">
                    <small id="nicknameHelp" class="form-text text-muted">
                        공백없이 문자와 숫자로만 3자 이상 20자 이내로 입력하세요. 가입후에 변경할 수 있습니다.
                    </small>
                    <small class="invalid-feedback">닉네임을 입력하세요.</small>
                    <small class="form-text text-danger" th:if="${#fields.hasErrors('nickname')}" th:errors="*{nickname}">Nickname Error</small>
                </div>
            </form>
            

form

th:action

form 태그 사용 시, 해당 경로로 요청을 보낼때 사용(url)

th:object

form submit을 할 때, form의 데이터가 th:object에 설정해준 객체로 받아진다.

th:field

각각 필드들을 매핑해주는 역햘을 한다. 설정해준 값으로, th:object에 설정해준 객체의 내부와 매칭해준다.

	   <form th:action="@{/sign-up}" th:object="${signUpForm}" method="post">
                <div class="form-group">
                    <label for="nickname">닉네임</label>
                    <input id="nickname" type="text" th:field="*{nickname}" class="form-control">
                </div>
            </form>