th:each 遍历集合

基本语法:

<div th:each="变量名 : 集合"> 
	<p th:text="${变量名}"></p> 
</div>

示例:遍历对象集合

  • 后台代码
@Controller
public class TestController {
   

    @RequestMapping("/th")
    public String index(Model model) {
   
        List<Student> stuList = new ArrayList<Student>();
        stuList.add(new Student(2019001, "小明"));
        stuList.add(new Student(2019002, "小丽"));
        stuList.add(new Student(2019003, "小王"));
        model.addAttribute("stuList", stuList);

        return "th/index";
    }
}
  • 前端代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table>
    <tr>
        <th>学号</th>
        <th>姓名</th>
    </tr>
    <tr th:each="stu:${stuList}">
        <td th:text="${stu.id}">000</td>
        <td th:text="${stu.name}">nobody</td>
    </tr>
</table>


</body>
</html>
  • Student.java
package com.example.demo.bean;

public class Student {
   
    private Integer id;  //学号
    private String name;  //姓名

    public Student() {
   
    }

    public Student(Integer id, String name) {
   
        this.id = id;
        this.name = name;
    }

    public Integer getId() {
   
        return id;
    }

    public void setId(Integer id) {
   
        this.id = id;
    }

    public String getName() {
   
        return name;
    }

    public void setName(String name) {
   
        this.name = name;
    }
}
  • 运行结果:

迭代状态变量的使用

在集合的迭代过程还可以获取状态变量,只需在变量后面指定状态变量 名即可,通过状态变量的属性可获取集合的下标/序号、总数、是否为单 数/偶数行、是否为第一个/最后一个等信息。

<div th:each = "变量名,状态变量名 : 集合" > 
	<p th:text = "${状态变量.属性}" ></p> 
</div>

注:如果缺省状态变量名,则迭代器会 默认以变量名开头的状态变量 xxxStat

状态变量的属性
index:当前迭代对象的序号,从0开始,这是索引属性
count:当前迭代对象的序号,从1开始,这个是统计属性
size:迭代变量元素的总量,这是被迭代对象的大小属性
even/odd:布尔值,当前循环是否是偶数/奇数(从0开始计算)
first:布尔值,当前循环是否是第一个
last:布尔值,当前循环是否是最后一个
current:当前迭代变量

  • 示例:带状态变量的遍历(加了一点样式)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table>
    <tr>
        <th>序号(从0开始)</th>
        <th>序号(从1开始)</th>
        <th>学号</th>
        <th>姓名</th>
    </tr>
    <tr th:each=" stu, stat : ${stuList}" th:class="${ stat.odd } ? 'odd' : 'even' ">
        <td th:text=" ${ stat.index } ">0</td>
        <td th:text=" ${ stat.count } +'/' + ${ stat.size }">1</td>
        <td th:text="${stu.id}">000</td>
        <td th:text="${stu.name}">nobody</td>
    </tr>
</table>
<style> table {
      border-collapse: collapse; width: 500px; } th, td {
      border: 1px solid blue; text-align: center; } .odd {
      background-color: lightcyan; /*奇数样式*/ } .even {
      background-color: lightyellow; /*偶数样式*/ } </style>

</body>
</html>
  • 运行结果: