Как открыть первую вкладку по умолчанию Thymeleaf Css Bootstrap

Question

Я пытаюсь создать динамические вкладки на основе списка из бэкэнда Spring, используя Thymleaf и Bootstrap. Я могу создавать вкладки и контент, но проблема в том, что моя первая вкладка не открывается по умолчанию, но когда я нажимаю, я могу открыть ее.

---

<ul class="nav nav-tabs" >
        <li class="nav-item" th:each="t, tNum: ${tx}">
            <a class="nav-link" th:classappend="${tNum.first} ? 'active'"  th:href="@{'#'+ ${t.ticker}}" data-toggle="tab"><label th:text="${t.ticker}">bar title</label></a>
        </li>
    </ul>

<div class="tab-content">
        <div class="tab-pane" th:id="${t.ticker}"th:classappend="${tNum.first} ? 'active'"  th:each="t, tNum: ${tx}">
            <h3 th:text = "${t.ticker}">bar content</h3> 
</div>
</div>

Answer 1

Здесь в документации, которую он пишет, чтобы добавить активный класс для открытия нужной вкладки.

 <li class="nav-item">
    <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
  </li>

 <div class="tab-content" id="myTabContent">
  <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>

Я думаю, этого достаточно, вы можете добавить его либо с помощью js, либоHTML.