Thymeleaf  관련 글 보기

Thymeleaf에서 특정 요소를 for문처럼 반복하는 방법으로 th:each가 있습니다.

<table>
  <thead>
    <tr>
      <th>No.</th>
      <th>username</th>
      <th>title</th>
      <th>date</th>
    </tr>
  </thead>
  <tbody>
    ....................
  </tbody>
</table>
<tbody>
  <tr th:each="article, i: ${list}">
    <td th:text="${article.seq}"></td>
    <td th:text="${article.username}"></td>
    <td sec:authorize="isAuthenticated()">
      <a th:href="${'/board/read/' + article.seq}" th:text="${article.title}"></a>
      <span class="text-blue" th:if="${i.count eq i.size}">[1등]</span>
    </td>
    <td sec:authorize="!isAuthenticated()" th:text="${article.title}"></td>
    <td th:text="${article.writeDate}"></td>
  </tr>
</tbody>

이렇게 코드를 작성하면 <tr> 요소가 리스트 사이즈만큼 반복됩니다. 2라인에서 인덱스 부분인 두번째 변수 i 는 옵션입니다. 인덱스를 사용하지 않는다면 th:each="article: ${list}" 이렇게만 적어도 됩니다.

인덱스 변수는 .index / .count / .size 등의 기능이 있으며, .index는 0부터 시작, .count는 1부터 시작, .size는 리스트의 사이즈를 가져옵니다. 리스트의 맨 마지막을 순회할 때 동작을 지정하고 싶다면 th:if="${i.count eq i.size}"를 사용합니다.

 

참고로 컨트롤러에서 넘어오는 list 변수는 아래와 같은 List<Map<String, Object>> 타입입니다.

@RequestMapping("/board")
public String board(Model model) {
  List<Map<String, Object>> list = [DAO를 통해 DB 테이블을 가져옴];
  
  model.addAttribute("list", list);
  return "simple-board";
}

문의 | 코멘트 또는 yoonbumtae@gmail.com




4개의 댓글

강동현 · 2020년 8월 19일 1:55 오후

혹시 list로 List<Map 형태로 가져오는데 depth가 2까지있는 트리구조로 html로 표현하고싶은데

예를들면어 두 페이지가 있다면,

1. 서비스관리 – 이벤트관리 – 이벤트 등록페이지
2. 서비스관리 – 이벤트관리 – 이벤트 상세페이지
서비스관리 – 이벤트관리가 겹치는것만 한번 나타내고 나머지 2번만 나타내려면 어떻게 해야할까요?

    yoonbumtae (BGSMM) · 2020년 8월 19일 2:59 오후

    안녕하세요.
    워드프레스 오류 때문에 < 문자 이후의 코멘트가 다 잘려서 질문이 제대로 나오지 않습니다.
    질문의 변수구조를 정확하게 모르기 때문에 저도 정확한 답변을 드릴 수 없지만
    예를 들어 자료형이 List[Map[String, List[DTO]] 이고
    [depth1 th:each="item, i: ${list}"] 이런 식으로 된 코드가 있다고 하면
    그 안에 [depth2 th:each="innerItem, j: ${item.mapKey}"]를 하나 더 만들면 되지 않을까 싶습니다.
    감사합니다.

어려움 · 2020년 9월 14일 1:35 오후

질문드립니다
여기서 article는 vo값이 맞는지 아니라면 어떤값인지 궁금합니다
seq는 테이블의 키값이라고 생각하는대 제가 생각하고있는게 맞나요?

    yoonbumtae (BGSMM) · 2020년 9월 15일 1:58 오후

    안녕하세요.
    articlelist 안에 있는 vo가 맞습니다.
    예를 들어 자바에서 List[CustomVO] list = ## 인 경우 articleCustomVO 에 대응됩니다.
    그리고 seq도 데이터베이스상의 키값이 맞습니다. (이름은 제가 임의로 지었습니다.) 스크린샷 참고해주세요.
    감사합니다.

답글 남기기

Avatar placeholder

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다