thymeleaf（3） - Iteration

最新推荐文章于 2024-04-04 18:05:52 发布

mytt_10566

最新推荐文章于 2024-04-04 18:05:52 发布

阅读量252

点赞数

分类专栏： thymeleaf 文章标签： thymeleaf Iteration th:each

本文链接：https://blog.csdn.net/mytt_10566/article/details/81463537

版权

thymeleaf 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

官方文档（2.x）：https://www.thymeleaf.org/doc/tutorials/2.1/usingthymeleaf.html#iteration

翻译的官方文档，可以直接看文档里的说明，更能有自己的体会和收获。

1. Iteration基础

1.1 使用th:each

对于我们的产品列表页，我们将产品列表放到request上下文中（这里已经与SpringBoot集成）：

@RequestMapping("/product/list")

public String productList(Model model) {
    // 产品列表
    model.addAttribute("prodList", productService.listAll());

    // 对应于src/main/resources/templates/product-list.html
    return "product-list";

}

在product-list.html页面上使用th:each去迭代prodList（产品列表）

<body>
    ...
    <h1>Product list</h1>
  
    <table>
      <tr>
        <th>名称</th>
        <th>价格</th>
        <th>现货</th>
      </tr>
      <tr th:each="prod : ${prods}">
        <td th:text="${prod.name}">洋葱</td>
        <td th:text="${prod.price}">2.41</td>
        <td th:text="${prod.inStock}? '有' : '无'">有</td>
      </tr>
    </table>
    ...
</body>

${prods}：被迭代表达式或被迭代变量
prod：迭代变量

提示：prod变量将仅仅可以在<tr>元素内部使用（包括内部标签如<td>）

1.2 可以迭代的类型

实现了java.util.Iterable的对象
实现了java.util.Map的对象，迭代变量是java.util.Map.Entry
数组
任何其他对象都将被视为包含对象本身的单值列表

2. 保持迭代状态

在使用th:each时，Thymeleaf提供了一种实用的，用于跟踪迭代状态的机制-状态变量。状态变量在th:each属性中被定义，主要包含以下变量：

index：当前迭代下标，从0开始
count：当前迭代下标，从1开始
size：迭代变量元素总数
current：当前迭代的元素
even/odd：是否当前迭代是偶数/奇数
first：是否当前迭代是第一个
last：是否当前迭代是最后一个

2.1 让我们看下如何在之前的例子中使用这些状态变量：

<table>
  <tr>
    <th>名称</th>
    <th>价格</th>
    <th>现货</th>
  </tr>
  <tr th:each="prod,iterStat : ${prods}" th:class="${iterStat.odd}? 'odd'">
    <td th:text="${prod.name}">洋葱</td>
    <td th:text="${prod.price}">2.41</td>
    <td th:text="${prod.inStock}? '有' : '无'">有</td>
  </tr>
</table>

我们可以看到，在迭代变量（prod）后定义了状态变量iterStat，通过英文逗号分隔。状态变量只可以在包含th:each属性的标签下使用。

2.2 假如我们不明确地设置一个状态变量，Thymeleaf将会自动为我们创建一个，变量名为：迭代变量+Stat

例2.1中自动创建的状态变量名为prodStat，那么可以修改为下面的形式：

<table>
  <tr>
    <th>序号</th>
    <th>名称</th>
    <th>价格</th>
    <th>现货</th>
  </tr>
  <tr th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'">
    <td th:text="${prodStat.count}">1</td>
    <td th:text="${prod.name}">洋葱</td>
    <td th:text="${prodStat.current.price}">2.41</td>
    <td th:text="${prod.inStock}? '有' : '无'">有</td>
  </tr>
</table>