타임리프 문법

 

 

• 반복문 th:each

 

지금 itemRepository에 있는 item 클래스 객체들을 싹 긁어서 모델에 items 라는 이름으로 전달

@GetMapping("/list")
    String hello(Model model){
        List<Item> result = itemRepository.findAll();
        model.addAttribute("items",result);
        return "list.html";
    }

 

th:each 반복문으로 items를 순회하면서 안에 있는 요소 하나하나 출력

<div class="card" th:each = "i : ${items}">
    <img src="https://placehold.co/300">
    <div>
        <h4 th:text="${i.id}"></h4>
        <h4 th:text="${i.title}"></h4>
        <h4 th:text="${i.price}"></h4>
    </div>
</div>

 

• css 재활용하기 th:fragment, th:replace

 

네비게이션바를 재활용 할려고 nav.html을 작성하고 th:fragment로 이름 지정

<div class="nav" th:fragment = "navbar">
    <a class="logo">SpringMall</a>
    <a href ="/list" >List</a>
    <a href="write.html" >Write</a>
</div>

 

이런 식으로 가져다가 쓴다

<div th:replace = "~{nav.html::navbar}"></div>

 

• th:href로 model 데이터 받아서 링크 이동

/detail/1 /detail/2 등 값으로 이동시킬 수 있다

<a th:href="@{'/detail/'+${i.id}}">상세페이지</a>

 

• 타임리프에선 error.html을 만들어서 에러처리가 가능하다