Thymeleaf常用语法:数据迭代
Thymeleaf数据迭代使用th:each属性,可以迭代数组、List、Set和Map等,数组、List、Set的迭代方法类似,迭代Map则会得到一个java.util.Map.Entry对象。
在迭代过程中,还可以获取迭代状态的变量,如迭代索引、数据集合大小等等。
开发环境:IntelliJ IDEA 2019.2.2
Spring Boot版本:2.1.8
新建一个名称为demo的Spring Boot项目。
1、pom.xml
加入Thymeleaf依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
2、src/main/java/com/example/demo/User.java
package com.example.demo;
public class User {
Integer id;
String name;
public User(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;
}
}
3、src/main/java/com/example/demo/TestController.java
package com.example.demo; import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping; import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map; @Controller
public class TestController {
@RequestMapping("/")
public String test(Model model){
List<User> users = new ArrayList<User>();
users.add(new User(1,"张三"));
users.add(new User(2,"李四"));
users.add(new User(3,"王五"));
model.addAttribute("users", users); Map<String, User> userMap = new HashMap<String,User>();
userMap.put("a", new User(4, "赵六"));
userMap.put("b", new User(5, "钱七"));
model.addAttribute("userMap", userMap);
return "test";
}
}
4、src/main/resources/templates/test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
table { border-collapse:collapse;}
td { border: 1px solid #C1DAD7;}
</style>
</head>
<body> <div>迭代List</div>
<table>
<tr th:each="user : ${users}">
<td th:text="${user.id}"></td>
<td th:text="${user.name}"></td>
</tr>
</table> <div>迭代Map</div>
<table>
<tr th:each="map : ${userMap}">
<td th:text="${map.key} + |--| + ${map.value.id} + |--| + ${map.value.name}"></td>
</tr>
</table> <div>迭代状态对象</div>
<table>
<tr th:each="data,iterState : ${#numbers.sequence(0,2)}"
th:style="|background-color:| + ${iterState.odd ? 'while' : 'gray'}">
<td th:text="|从0开头的索引:| + ${iterState.index}"></td>
<td th:text="|从1开头的索引:| + ${iterState.count}"></td>
<td th:text="|数据集合大小:| + ${iterState.size}"></td>
<td th:text="|当前节点:| + ${iterState.current}"></td>
<td th:text="|是否第一次迭代:| + ${iterState.first}"></td>
<td th:text="|是否最后一次迭代:| + ${iterState.last}"></td>
<td th:text="|是否偶数迭代:| + ${iterState.even}"></td>
<td th:text="|是否奇数迭代:| + ${iterState.odd}"></td>
</tr>
</table>
上面的iterState是显式声明的迭代状态对象,也可以按默认规划“节点变量名+Stat”获取
<table>
<tr th:each="data : ${#numbers.sequence(0,2)}"
th:style="|background-color:| + ${dataStat.odd ? 'while' : 'gray'}">
<td th:text="${data}"></td>
</tr>
</table>
<table>
<tr th:each="user : ${users}"
th:style="|background-color:| + ${userStat.odd ? 'while' : 'gray'}">
<td th:text="${user.id}"></td>
<td th:text="${user.name}"></td>
</tr>
</table> </body>
</html>
浏览器访问:http://localhost:8080,截图如下:

右键查看网页源代码,生成的HTML源码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
table { border-collapse:collapse;}
td { border: 1px solid #C1DAD7;}
</style>
</head>
<body> <div>迭代List</div>
<table>
<tr>
<td>1</td>
<td>张三</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
</tr>
<tr>
<td>3</td>
<td>王五</td>
</tr>
</table> <div>迭代Map</div>
<table>
<tr>
<td>a--4--赵六</td>
</tr>
<tr>
<td>b--5--钱七</td>
</tr>
</table> <div>迭代状态对象</div>
<table>
<tr style="background-color:while">
<td>从0开头的索引:0</td>
<td>从1开头的索引:1</td>
<td>数据集合大小:3</td>
<td>当前节点:0</td>
<td>是否第一次迭代:true</td>
<td>是否最后一次迭代:false</td>
<td>是否偶数迭代:false</td>
<td>是否奇数迭代:true</td>
</tr>
<tr style="background-color:gray">
<td>从0开头的索引:1</td>
<td>从1开头的索引:2</td>
<td>数据集合大小:3</td>
<td>当前节点:1</td>
<td>是否第一次迭代:false</td>
<td>是否最后一次迭代:false</td>
<td>是否偶数迭代:true</td>
<td>是否奇数迭代:false</td>
</tr>
<tr style="background-color:while">
<td>从0开头的索引:2</td>
<td>从1开头的索引:3</td>
<td>数据集合大小:3</td>
<td>当前节点:2</td>
<td>是否第一次迭代:false</td>
<td>是否最后一次迭代:true</td>
<td>是否偶数迭代:false</td>
<td>是否奇数迭代:true</td>
</tr>
</table>
上面的iterState是显式声明的迭代状态对象,也可以按默认规划“节点变量名+Stat”获取
<table>
<tr style="background-color:while">
<td>0</td>
</tr>
<tr style="background-color:gray">
<td>1</td>
</tr>
<tr style="background-color:while">
<td>2</td>
</tr>
</table>
<table>
<tr style="background-color:while">
<td>1</td>
<td>张三</td>
</tr>
<tr style="background-color:gray">
<td>2</td>
<td>李四</td>
</tr>
<tr style="background-color:while">
<td>3</td>
<td>王五</td>
</tr>
</table> </body>
</html>
Thymeleaf常用语法:数据迭代的更多相关文章
- Thymeleaf常用语法:表达式语法之运算符
Thymeleaf表达式语法之常量分为字符串常量.数字常量.布尔值常量.空值常量:运算符分为算术运算符.关系运算符.条件运算符.无操作符. 开发环境:IntelliJ IDEA 2019.2.2Spr ...
- Thymeleaf常用语法:数据延迟加载
在处理模板时,可以由模板逻辑决定是否加载数据,以提高性能.在Spring Boot控制器中设置数据时,使用LazyContextVariable可以实现这功能. 开发环境:IntelliJ IDEA ...
- 1-9springboot之thymeleaf常用语法(html页面)
一.引用命名空间 <html xmlns:th="http://www.thymeleaf.org"> 在html中引入此命名空间,可避免编辑器出现html验证错误,虽 ...
- thymeleaf常用语法
常用标签语法:①th:text<span th:text="${name}">1</span>注释:如果${name}有值则将替换掉1的值,若无则为1 ②t ...
- Thymeleaf常用语法:模板片断
系统中的很多页面有很多公共内容,例如菜单.页脚等,这些公共内容可以提取放在一个称为“模板片断”的公共页面里面,其它页面可以引用这个 “模板片断”内容. 一.模板片断的定义 可以是html标签,也可以使 ...
- Thymeleaf常用语法:模板注释
Thymeleaf模板注释分为标准HTML/XML注释.解析层注释.原型注释三种. 一.注释说明 1.标准HTML/XML注释 直接通过浏览器打开,不显示,Thymeleaf模板引擎解析也不处理,但查 ...
- Thymeleaf常用语法:HTML属性设置
使用Thymeleaf的属性来设置HTML属性.(1)使用th:attr属性可以修改原来HTML节点的属性:(2)th:attr属性可以同时设置多个属性:(3)每一个HTML属性都有对应的Thymel ...
- Thymeleaf常用语法:使用星号表达式
在处理模板时,一般情况都是使用变量表达式 ${...} 来显示变量,还可以使用选定对象表达式 *{...},它也称为星号表达式.如果在模板中先选定了对象,则需要使用星号表达式.Thymeleaf的内置 ...
- Thymeleaf常用语法:条件判断 if、switch case
if语句条件判断使用th:if,它会判断表达式是否成立,表达式的结果支持boolean.number.character.String及其他类型.满足下面情况,if语句成立:(1) 表达式的结果是数字 ...
随机推荐
- Android 开机充电图标和充电动画
首先驱动需要先获取到2个power supply kernel\msm-3.18\drivers\usb\phy\phy-msm-usb.c motg->usb_psy.name = " ...
- docker拉取慢(net/http: request canceled while waiting for connection (Client.Timeout exceeded while awaiting head)
systemctl restart docker在docker-hub拉取慢,因为服务器在外网 直接配置阿里云镜像就可以 首先: vim /etc/docker/daemon.json加入下面的那句 ...
- Paper | MFQE 2.0: A New Approach for Multi-frame Quality Enhancement on Compressed Video
目录 1. 要点 2. 压缩视频特性分析 2.1 质量波动 2.2 帧间相关性 3. 方法 3.1 分类器 3.2 好帧运动补偿 3.3 质量增强网络 4. 实验 4.1 差帧质量提升效果 4.2 总 ...
- 集合系列 Queue(十一):ArrayDeque
从名字我们可以看出,其实一个双向队列实现,而且底层采用数组实现. public class ArrayDeque<E> extends AbstractCollection<E> ...
- 现代“十二要素应用”与 Kubernetes
"十二要素应用"为开发SaaS应用提供了方法上的指导,而Docker能够提供打包依赖,解耦后端服务等特性,使得两者非常吻合.这篇文章介绍了Docker特性怎样满足了开发" ...
- 关于css布局的记录(二) --网格布局
网格布局 学习来自阮一峰老师的教程网格布局和网络上的一些资料的学习 1.定义: 顾名思义,网格布局是将页面按行(row)和列(column)划分成一个个网格来进行布局 使用方法:display:gri ...
- 解密国内BAT等大厂前端技术体系-腾讯篇(长文建议收藏)
1 引言 为了了解当前前端的发展趋势,让我们从国内各大互联网大厂开始,了解他们的最新动态和未来规划.这是解密大厂前端技术体系的第三篇,前两篇已经讲述了阿里和百度在前端技术这几年的技术发展.这一篇从腾讯 ...
- bbbbbb
Blazor 机制初探以及什么是前后端分离,还不赶紧上车? 标签: Blazor .Net 上一篇文章我发了一个 BlazAdmin 的尝鲜版,这一次主要聊聊 Blazor 是如何做到用 C# 来写前 ...
- 深入解析ReentrantReadWriteLock
前言: 在Java的锁中很多锁都是同一时刻只允许一个线程访问,今天就来看看一个特殊的锁——读写锁.它的特殊之处就在于同一时刻可以运行多个读线程访问或者有一个写线程在访问.能够大大的提高并发性和吞吐量 ...
- ORA-14061: 不能更改索引分区列的数据类型或长度
修改分区表主键时报错: 在行: 2 上开始执行命令时出错 -alter table KC23 modify AAZ210 VARCHAR2(50)错误报告 -SQL 错误: ORA-14061: 不能 ...