当使用 th:each 时,Thymeleaf 提供了一种机制来跟踪迭代的状态:状态变量。
状态变量被定义在 th:each 属性中,包含以下数据:
(1)index:当前的迭代索引,从 0 开始。
(2)count:当前的迭代索引,从 1 开始。
(3)size:迭代变量中元素的总数量。
(4)curent:每次迭代的 iter 变量(即迭代变量,保存当前迭代的元素)。
(5)even/odd:当前的迭代是偶数还是奇数行,even/odd 为布尔类型。
(6)first:当前迭代是否为第一次迭代,first 为布尔类型。
(7)last:当前的迭代是否是最后一次,last 为布尔类型。
让我们看看我们如何用前面的例子来使用它。如下:
<table> <thead> <tr> <th>NAME</th> <th>PRICE</th> <th>IN STOCK</th> <th>COMMENTS</th> </tr> </thead> <tbody th:remove="all-but-first"> <tr th:each="prod,status : ${prods}" th:class="${status.odd}? 'odd'"> <td th:text="${prod.name}">Onions</td> <td th:text="${prod.price}">2.41</td> <td th:text="${prod.inStock}? #{true} : #{false}">yes</td> <td> <span th:text="${#lists.size(prod.comments)}">2</span> comment/s <a href="comments.html" th:href="@{/product/comments(prodId=${prod.id})}" th:unless="${#lists.isEmpty(prod.comments)}">view</a> </td> </tr> <!--...--> </tbody> </table>
状态变量(本例中的 status)是在 th:each 属性中定义的,方法是将其名称写在 iter 变量本身之后,用逗号隔开。就像 iter 变量一样,状态变量也被定义在持有 th:each 属性的标签所定义的代码片段中。
让我们来看看我们的模板的处理结果:
<table> <thead> <tr> <th>NAME</th> <th>PRICE</th> <th>IN STOCK</th> <th>COMMENTS</th> </tr> </thead> <tbody> <tr class="odd"> <td>Fresh Sweet Basil</td> <td>4.99</td> <td>yes</td> <td> <span>0</span> comment/s </td> </tr> <tr> <td>Italian Tomato</td> <td>1.25</td> <td>no</td> <td> <span>2</span> comment/s <a href="/gtvg/product/comments?prodId=2">view</a> </td> </tr> <tr class="odd"> <td>Yellow Bell Pepper</td> <td>2.50</td> <td>yes</td> <td> <span>0</span> comment/s </td> </tr> <tr> <td>Old Cheddar</td> <td>18.75</td> <td>yes</td> <td> <span>0</span> comment/s </td> </tr> <!-- ... --> </table>
注意,我们的迭代状态变量已经完美地工作了,只对奇数行建立奇数的 CSS 类。
如果你没有明确地设置一个状态变量(即通过逗号手动定义状态变量),Thymeleaf 默认通过在迭代变量的名称添加 Stat 后缀来为你创建一个内置的状态变量。例如
<table> <thead> <tr> <th>NAME</th> <th>PRICE</th> <th>IN STOCK</th> <th>COMMENTS</th> </tr> </thead> <tbody th:remove="all-but-first"> <tr th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'"> <td th:text="${prod.name}">Onions</td> <td th:text="${prod.price}">2.41</td> <td th:text="${prod.inStock}? #{true} : #{false}">yes</td> <td> <span th:text="${#lists.size(prod.comments)}">2</span> comment/s <a href="comments.html" th:href="@{/product/comments(prodId=${prod.id})}" th:unless="${#lists.isEmpty(prod.comments)}">view</a> </td> </tr> <!--...--> </tbody> </table>
上例中的 prodStat 状态变量就是 Thymeleaf 自动为我们创建的。