4）Thymeleaf th:each 循环迭代与 th:if、th:switch 条件判断

爱被打了一巴掌 2022-04-12 07:18 879阅读 0赞

**目录**

th:each 循环迭代

th:each  获取迭代状态

th:if 条件判断 true

th:unless 条件判断 false

th:switch case 条件匹配

--------------------

# th:each 循环迭代 #

1、对于信息页面，数据格式是一样时，页面通常都是循环迭代它们，写过 JSP 的 JSTL 的就知道，JSTL 有一个 <c:foreach>，同理 Thymeleaf 也有一个 th:each。作用都是一样的，都是用于遍历数组、List、Set、Map 等数据。

2、JSTL th:each 遍历格式如下：

<c:foreach items ="${lis}" var = "li " begin="2" end ="12">
         ${li}
    </c:foreach>
         Thymeleaf 遍历格式如下：
    <tr th:each="user : ${userList}">
          <td th:text="${user.name}">xxx</td>
    </tr>

3、Thymeleaf  th:each 遍历格式如下：

<body>
    
    
    <table border="1">
        <thead>
        <tr>
            <th>工号</th>
            <th>姓名</th>
            <th>生日</th>
            <th>是否已婚</th>
            <th>工资</th>
        </tr>
        </thead>
        <tbody>
        
        <tr th:each="user : ${userList}">
            
            <td th:text="${user.uId}" th:name="${user.uId}"></td>
            <td th:text="${user.uName}"></td>
            
            <td th:text="${#dates.format(user.birthday, 'yyyy-MM-dd HH:mm')}"></td>
            
            <td th:text="${user.isMarry}?'是':'否'"></td>
            <td th:text="${user.price}"></td>
        </tr>
        </tbody>
    </table>
    </body>

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdteDE5OTMzMjg_size_16_color_FFFFFF_t_70][]

> 1）th:each="user : $\{userList\}，意味着对于 $\{userList\} 结果中的每个元素，循环迭代当前模板⽚段，并使⽤名为”user“的变量作为当前迭代元素来填充模版数据。
> 
> 2）如果被遍历的变量为 null，或者不存在，则直接不会遍历。
> 
> 3）th:each="user : $\{userList\} 作用域为自己的整个标签内，包括自己，如上所示为 <tr>。
> 
> 4）级联获取属性值：`<td th:text="${user.department.depName}"></td>，`假设 User 中关联了 Department 对象.

4、如下所示为遍历下拉框的代码，因为 th:each 的作用域包括自己，所以遍历与取值都在同一个 <option> 标签中：

![20190409095805940.gif][]

**被迭代变量的值类型**

1、java.util.List 类型不是可以在 Thymeleaf 中使⽤迭代的唯⼀值类型，下⾯这些类型的对象都可以通过 th:each 进⾏迭代的：

> 1）任何实现 java.util.Iterable 接⼝的对象，其值将被迭代器返回，⽽不需要在内存中缓存所有值。  
> 2）任何实现 java.util.Enumeration 接⼝的对象。  
> 3）任何实现 java.util.Map 接⼝的对象， 迭代映射时，iter 变量将是 java.util.Map.Entry 类。  
> 4）任何数组。  
> 5）任何其将被视为包含对象本身的单值列表。

# th:each  获取迭代状态 #

1、迭代过程中，经常会使用到它的一些迭代状态，如：当前迭代的索引，迭代变量中的元素的总数，当前迭代的是奇数还是偶数，当前是否是第一个元素，当前是否是最后一个元素 等等。

2、在 JSP 的 JSTL 中是 <c:foreach items="$\{list\}" var ="li" varStatus="status"> 里面的 status 属性。

3、使⽤ th:each 时，Thymeleaf 提供了⼀种⽤于跟踪迭代状态的机制：状态变量。状态变量在每个 th:each 属性中定义，并包含以下数据：

> 1）index 属性：当前迭代索引，从0开始  
> 2）count 属性：当前的迭代计数，从1开始  
> 3）size 属性：迭代变量中元素的总量  
> 4）current 属性：每次迭代的 iter 变量，即当前遍历到的元素  
> 5）even/odd 布尔属性：当前的迭代是偶数还是奇数。  
> 6）first 布尔属性：当前的迭代是否是第⼀个迭代  
> 7）last 布尔属性：当前的迭代是否是最后⼀个迭代。

<body>
    
    
    <table border="1">
        <thead>
        <tr>
            <th>序号</th>
            <th>工号</th>
            <th>姓名</th>
            <th>生日</th>
            <th>是否已婚</th>
            <th>工资</th>
        </tr>
        </thead>
        <tbody>
        
        
        <tr th:each="user,loopStatus: ${userList}" th:class="${loopStatus.odd}?'css2'">
            
            <td th:text="${loopStatus.count}"></td>
            
            <td th:text="${user.uId}" th:name="${user.uId}"></td>
            <td th:text="${user.uName}"></td>
            
            <td th:text="${#dates.format(user.birthday, 'yyyy-MM-dd HH:mm')}"></td>
            
            <td th:text="${user.isMarry}?'是':'否'"></td>
            <td th:text="${user.price}"></td>
        </tr>
        </tbody>
    </table>

![20181202114853840.png][]

4、迭代状态变量（本示例中的 loopStatus ）在 th:each 属性中通过在变量 user 之后直接写其名称来定义，⽤逗号分隔。 与 iter 变量⼀样，状态变量的作⽤范围也是 th:each 属性的标签定义的代码⽚段中。

5、如果没有显式地设置状态变量，则 Thymeleaf 将始终创建⼀个默认的迭代变量，该状态迭代变量名称为：迭代变量+“Stat”。

# th:if 条件判断 true #

1、很多时候只有在满⾜某个条件时，才将⼀个模板⽚段显示在结果中，否则不进行显示。比如只有当用户有订单时，才为它显示订单链接，否则不显示。th:if 属性用于满足这个需求：

<body>
    
    <p th:if="true">th:if="true"</p>
    
    <p th:if="false">th:if="false"</p>
    
    
    <p th:if="${isMarry}">已婚</p>
    </body>

![20181202130515704.png][]

2、th:if 属性不仅只以布尔值作为判断条件，它将按照如下规则判定指定的表达式结果为 true：

> 1）如果表达式结果为布尔值，则为 true 或者 false  
> 2）如果表达式的值为 null，th:if 将判定此表达式为 false  
> 3）如果值是数字，为 0 时，判断为 false；不为零时，判定为 true  
> 4）如果 value 是 String，值为 “false”、“off”、“no” 时，判定为 false，否则判断为 true，字符串为空时，也判断为 true  
> 5）如果值不是布尔值，数字，字符或字符串的其它对象，只要不为 null，则判断为 true

<body>
    
    <p th:if="true">th:if="true"</p>
    
    <p th:if="null">th:if="null"</p>
    
    <p th:if="11">th:if="11"</p>
    <p th:if="0">th:if="0"</p>
    
    
    
    <p th:if="'true'">th:if="'true'"</p>
    <p th:if="'false'">th:if="'false'"</p>
    <p th:if="'off'">th:if="'off'"</p>
    <p th:if="'no'">th:if="'no'"</p>
    
    <p th:if="'Love China'">th:if="'Love China'"</p>
    
    
    
    <p th:if="${userList}">th:if="${userList}"</p>
    
    
    
    <p th:if="${name}eq''">name 等于空</p>
    <p th:if="${name}">th:if="${name}"</p>
    </body>

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdteDE5OTMzMjg_size_16_color_FFFFFF_t_70 1][]

# th:unless 条件判断 false #

1、th:unless 是 th:if 的反向属性，它们判断的规则一致，只是 if 当结果为 true 时进行显示，unless 当结果为 false 进行显示。

<body>
    
    <p th:unless="false">th:unless="false"</p>
    <p th:unless="true">th:unless="true"</p>
    
    
    <p th:if="${isMarry}">已婚1</p>
    <p th:unless="!${isMarry}">已婚2</p>
    </body>

![20181202133212659.png][]

# th:switch case 条件匹配 #

1、th:switch / th:case 与 Java 中的 switch 语句等效，有条件地显示匹配的内容。

2、只要其中⼀个 th:case 的值为 true，则同⼀个 switch 语句中的其他 th:case 属性都将被视为 false。当有多个 case 的值为 true 时，则只取第一个。

3、switch 语句的 default 选项指定为 th:case =“\*”，即当没有 case 的值为 true 时，将显示default 的内容，如果有多个 default ，则只取第一个。

![20181202134929935.png][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdteDE5OTMzMjg_size_16_color_FFFFFF_t_70]: /images/20220412/c449d12eb8564a5ba0fae7b119cf9db2.png
[20190409095805940.gif]: /images/20220412/3e8f8802459a423b8157629c44002307.png
[20181202114853840.png]: /images/20220412/d59b771b8b034317a8cf74aa3b96ca7f.png
[20181202130515704.png]: /images/20220412/aff18d8afc6141cdb4cd67ac8604437c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdteDE5OTMzMjg_size_16_color_FFFFFF_t_70 1]: /images/20220412/aa09af2cfd4240d98b1452d5a579d40a.png
[20181202133212659.png]: /images/20220412/a632d9fe7dc5479da5b0fc53ea389ec1.png
[20181202134929935.png]: /images/20220412/d0cb51383dad4c0cb60b2e3deeafaae6.png