利用th:each语法就可以实现嵌套迭代
下面是一个基于bootstrap选项卡的实现,里面使用了从后台传来的两个对象, 一个是list 一个是list<list>嵌套形式的
第二个嵌套list需要第一个list的值作为选项卡的url
下面以一个简单的课程id 和课程详情为例
<div class="panel panel-default gray-bg">
<div class="panel-heading">
<h4 class="panel-title">当前位置: 组合培养计划->组合</h4>
</div>
<div class="panel-body">
<ul id="tabs" class="nav nav-tabs">
<li th:each="plan, status : ${listPlan}">
<a th:href = "@{'#'+${plan}}"
th:text = "${plan}"
th:class = "${status.first} ? 'active' : '' "
data-toggle="tab"></a>
</li>
</ul>
<div id="tabsContent" class="tab-content">
<div th:each="plan, status : ${listPlan}"
class="tab-pane fade"
th:classappend = "${status.first} ? 'in active'"
th:id = "${plan}">
<table th:each = "message : ${planMessage[status.index]}">
<tr th:each="plans : ${message}">
<td th:text = "${plans.courseName}"></td>
<td th:text = "${plans.coursePeriod}"></td>
<td th:text = "${plans.courseTerm}"></td>
</tr>
</table>
</div>
</div>
</div>
后端代码
效果图: