Thymeleaf语法详解

news2025/1/10 23:58:26

目录

一、Thymeleaf介绍

（1）依赖

（2）视图

（3）控制层

二、变量输出

三、操作字符串

四、操作时间

五、条件判断

六、遍历集合

（1）迭代遍历

（2）将遍历的状态变量封装到一个对象中

七、遍历Map

八、获取域中的数据

（1）控制层

（2）视图

九、Thymeleaf中的URL写法

一、Thymeleaf介绍

Thymeleaf是一款用于渲染XML/HTML5内容的模板引擎，类似JSP。它可以轻易的与SpringMVC等Web框架进行集成作为Web应用的模板引擎。在SpringBoot中推荐使用Thymeleaf编写动态页面。

Thymeleaf最大的特点是能够直接在浏览器中打开并正确显示模板页面，而不需要启动整个Web应用。

Thymeleaf在有网络和无网络的环境下皆可运行，它即可以让美工在浏览器查看页面的静态效果，也可以让程序员在服务器查看带数据的动态页面效果。没有数据时，Thymeleaf的模板可以静态地运行；当有数据返回到页面时，Thymeleaf标签会动态地替换掉静态内容，使页面动态显示。

（1）依赖

<!--添加Thymeleaf起步依赖-->
<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-web</artifactId>
</dependency>

（2）视图

一定要注意templates的html文件不能直接访问，需要编写controller跳转到页面中

<!DOCTYPE html>
<!-- 引入thymeleaf命名空间，方便使用thymeleaf属性 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>thymeleaf入门</title>
</head>
<body>
<!-- thymeleaf支持el表达式 -->
<h2 th:text="${name}"></h2>
</body>
</html>

（3）控制层

@Controller
public class PageController {
  // 页面跳转
  @GetMapping("/show")
  public String showPage(Model model){
    model.addAttribute("name","Hello Thymeleaf");
    return "index";
   }
}

二、变量输出

th:text

作用：将model的值作为内容放入标签中。

th:value

作用：将model的值放入input标签的value属性中

<!DOCTYPE html>
<!-- 引入thymeleaf命名空间，方便使用thymeleaf属性 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>thymeleaf入门</title>
</head>
<body>
<!-- thymeleaf支持el表达式 -->
<h1>name=<span th:text="${name}"></span></h1>
<input th:value="${name}">
</body>
</html>

三、操作字符串

Thymeleaf提供了一些内置对象可以操作数据，内置对象可直接在模板中使用，这些对象是以#引用的，操作字符串的内置对象为strings。

方法	                                      说明
${#strings.isEmpty(key)}	    判断字符串是否为空，如果为空返回true，否则返回false
${#strings.contains(msg,'T')}	判断字符串是否包含指定的子串，如果包含返回true，否则返回false
${#strings.startsWith(msg,'a')}	判断当前字符串是否以子串开头，如果是返回true，否则返回false
${#strings.endsWith(msg,'a')}	判断当前字符串是否以子串结尾，如果是返回true，否则返回false
${#strings.length(msg)}	        返回字符串的长度
${#strings.indexOf(msg,'h')}	查找子串的位置，并返回该子串的下标，如果没找到则返回-1
${#strings.substring(msg,2,5)}	截取子串，用法与JDK的subString方法相同
${#strings.toUpperCase(msg)}	字符串转大写
${#strings.toLowerCase(msg)}	字符串转小写
<!DOCTYPE html>
<!-- 引入thymeleaf命名空间，方便使用thymeleaf属性 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>thymeleaf入门</title>
</head>
<body>
<!-- thymeleaf支持el表达式 -->
<span th:text="${#strings.length(name)}"></span>
<span th:text="${#strings.startsWith(name,'n')}"></span>
</body>
</html>

四、操作时间

操作时间的内置对象为dates

方法	                                      说明
${#dates.format(key)}	            格式化日期，默认的以浏览器默认语言为格式化标准
${#dates.format(key,'yyyy/MM/dd')}	按照自定义的格式做日期转换
${#dates.year(key)}	                取年
${#dates.month(key)}	            取月
${#dates.day(key)}	                取日
添加数据
model.addAttribute("date",new Date(130,01,01));
<!DOCTYPE html>
<!-- 引入thymeleaf命名空间，方便使用thymeleaf属性 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>thymeleaf入门</title>
</head>
<body>
<!-- thymeleaf支持el表达式 -->
<span th:text="${#dates.format(date)}"></span>
<span th:text="${#dates.format(date,'yyyy/MM/dd')}"></span>
<span th:text="${#dates.year(date)}"></span>
<span th:text="${#dates.month(date)}"></span>
</body>
</html>

五、条件判断

th:if  用于条件判断

th:switch/th:case  th:switch/th:case与Java中的switch语句等效。th:case="*"表示Java中switch的default，即没有case的值为true时显示th:case="*"的内容。

添加数据
 model.addAttribute("age",3);
<!DOCTYPE html>
<!-- 引入thymeleaf命名空间，方便使用thymeleaf属性 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>thymeleaf入门</title>
</head>
<body>
<!-- thymeleaf支持el表达式 -->
<span th:if="${age}==1">我是1</span>
<span th:if="${age}==2">我是2</span>
<span th:if="${age}==3">我是3</span>
</body>
</html>

<!DOCTYPE html>
<!-- 引入thymeleaf命名空间，方便使用thymeleaf属性 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>thymeleaf入门</title>
</head>
<body>
<!-- thymeleaf支持el表达式 -->
<div th:switch="${age}">
  <span th:case="1">我是1</span>
  <span th:case="2">我是2</span>
  <span th:case="3">我是3</span>
  <span th:case="4">我是4</span>
  <span th:case="*">我是不知道</span>
</div>
</body>
</html>

六、遍历集合

（1）迭代遍历

th:each  迭代器，用于循环迭代集合

 @GetMapping("/c1")
    public String t1(Model model){
        List<Users> users=new ArrayList<>();
        Users users1=new Users("2","pet",54);
        Users users2=new Users("18","ioi",7);
        Users users3=new Users("223","ppp",65);
        users.add(users1);
        users.add(users2);
        users.add(users3);
        model.addAttribute("li",users);
        return "index";
    }
<body>
<!-- thymeleaf支持el表达式 -->
<table border="1" width="50%">
  <tr>
    <th>id</th>
    <th>name</th>
    <th>age</th>
  </tr>
  <tr th:each="u:${li}">
    <td th:text="${u.id}"></td>
    <td th:text="${u.name}"></td>
    <td th:text="${u.age}"></td>
  </tr>
</table>
</body>

（2）将遍历的状态变量封装到一个对象中

thymeleaf将遍历的状态变量封装到一个对象中，通过该对象的属性可以获取状态变量：

状态变量含义
index当前迭代器的索引，从0开始
count当前迭代对象的计数，从1开始
size被迭代对象的长度
odd/even布尔值，当前循环是否是偶数/奇数，从0开始
first布尔值，当前循环的是否是第一条，如果是返回true，否则返回false
last布尔值，当前循环的是否是最后一条，如果是则返回true，否则返回false
<tr th:each="user,status : ${li}">
  <td th:text="${user.id}"></td>
  <td th:text="${user.name}"></td>
  <td th:text="${user.age}"></td>
  <td th:text="${status.index}"></td>
  <td th:text="${status.count}"></td>
  <td th:text="${status.size}"></td>
  <td th:text="${status.odd}"></td>
  <td th:text="${status.even}"></td>
  <td th:text="${status.first}"></td>
  <td th:text="${status.last}"></td>
</tr>

七、遍历Map

遍历Map出来的每一项是键值对，key获取键，value获取值

 @GetMapping("/c1")
    public String t1(Model model){
        Map<String,Users> map=new HashMap<>();
        map.put("u1",new Users("16","张三",90));
        map.put("u2",new Users("90","李四",12));
        map.put("u4",new Users("1","王一",16));
        model.addAttribute("us",map);
        return "index";
    }
<body>
<!-- thymeleaf支持el表达式 -->
<table border="1" width="50%">
  <tr>
    <th>键</th>
    <th>id</th>
    <th>name</th>
    <th>age</th>
  </tr>
  <tr th:each="u:${us}">
   <th th:text="${u.key}"></th>
    <th th:text="${u.value.id}"></th>
    <th th:text="${u.value.name}"></th>
    <th th:text="${u.value.age}"></th>
  </tr>
</table>
</body>

八、获取域中的数据

（1）控制层

@GetMapping("/c1")
    public String t1(HttpServletRequest request, HttpSession session){
        request.setAttribute("q1","我是request数据");
        session.setAttribute("s1","我绝对是session");
        ServletContext servletContext=session.getServletContext();
        servletContext.setAttribute("c1","我真的是context'数据");
        return "index";
    }

（2）视图

<body>
<!-- thymeleaf支持el表达式 -->
request1=<span th:text="${#request.getAttribute('q1')}"></span>
request2=<span th:text="${#httpServletRequest.getAttribute('q1')}"></span>
session=<span th:text="${session.s1}"></span>
session1=<span th:text="${#httpSession.getAttribute('s1')}"></span>
context1=<span th:text="${application.c1}"></span>
context2=<span th:text="${#servletContext.getAttribute('c1')}"></span>
</body>

九、Thymeleaf中的URL写法

在Thymeleaf中路径的写法为@{路径}

<a th:href="@{show2?id=1&name=gq}">静态参数一</a>
<a th:href="@{show2(id=2,name=gq)}">静态参数二</a>
<a th:href="@{'show2?id='+${id}+'&name='+${name}}">动态参数一</a>
<a th:href="@{show2(id=${id},name=${name})}">动态参数二</a>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1017401.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

Java————数组

Java————数组

1 、数组 数组可以看成是相同类型元素的一个集合&#xff0c; 在内存中是一段连续的空间。 每个空间有自己的编号&#xff0c;其实位置的编号为0&#xff0c;即数组的下标。 数组是引用类型。 1. 数组的创建 T[] 数组名 new T[N];T&#xff1a;表示数组中存放元素的类型 …
阅读更多...
Kakfa - Producer机制原理与调优

Kakfa - Producer机制原理与调优

Producer是Kakfa模型中生产者组件&#xff0c;也就是Kafka架构中数据的生产来源&#xff0c;虽然其整体是比较简单的组件&#xff0c;但依然有很多细节需要细品一番。比如Kafka的Producer实现原理是什么&#xff0c;怎么发送的消息&#xff1f;IO通讯模型是什么&#xff1f;在实…
阅读更多...
对Docker的认识和总结

对Docker的认识和总结

Docker简介 Docker 是一个开源的应用容器引擎&#xff0c;让开发者可以打包他们的应用以及依赖包到一个可移植的镜像中&#xff0c;然后发布到任何流行的 Linux或Windows操作系统的机器上&#xff0c;也可以实现虚拟化。容器是完全使用沙箱机制&#xff0c;相互之间不会有任何接…
阅读更多...
数据结构入门 — 二叉树的概念、性质及结构

数据结构入门 — 二叉树的概念、性质及结构

本文属于数据结构专栏文章&#xff0c;适合数据结构入门者学习&#xff0c;涵盖数据结构基础的知识和内容体系&#xff0c;文章在介绍数据结构时会配合上动图演示&#xff0c;方便初学者在学习数据结构时理解和学习&#xff0c;了解数据结构系列专栏点击下方链接。 博客主页&am…
阅读更多...
学习记忆——英语——字母编码

学习记忆——英语——字母编码

字母编码表 A&#xff1a;苹果 &#xff1b; B&#xff1a;一支笔或者小男孩boy &#xff1b; C&#xff1a;月亮或者镰刀 &#xff1b; D&#xff1a;笛子或者弟弟或者狗dog &#xff1b; E&#xff1a;大白鹅 &#xff1b; F&#xff1a;斧头 &#xff1b; G&#xff1a;鸽子…
阅读更多...
Python：安装Flask web框架hello world示例

Python：安装Flask web框架hello world示例

安装easy_install pip install distribute 安装pip easy_install pip 安装 virtualenv pip install virtualenv 激活Flask pip install Flask 创建web页面demo.py from flask import Flask app Flask(__name__)app.route(/) def hello_world():return Hello World! 2023if _…
阅读更多...
Spring注解家族介绍： @RequestMapping

Spring注解家族介绍： @RequestMapping

前言&#xff1a; 今天我们来介绍RequestMapping这个注解&#xff0c;这个注解的内容相对来讲比较少&#xff0c;篇幅会比较短。 目录 前言&#xff1a; RequestMapping 应用场景&#xff1a; 总结&#xff1a; RequestMapping RequestMapping 是一个用于映射 HTTP 请求…
阅读更多...
[Linux打怪升级之路]-缓冲区

[Linux打怪升级之路]-缓冲区

前言 作者&#xff1a;小蜗牛向前冲 名言&#xff1a;我可以接受失败&#xff0c;但我不能接受放弃 如果觉的博主的文章还不错的话&#xff0c;还请点赞&#xff0c;收藏&#xff0c;关注&#x1f440;支持博主。如果发现有问题的地方欢迎❀大家在评论区指正 本期学习目标&…
阅读更多...
SpringCloud Ribbon--负载均衡 原理及应用实例

SpringCloud Ribbon--负载均衡 原理及应用实例

&#x1f600;前言 本篇博文是关于SpringCloud Ribbon的基本介绍&#xff0c;希望你能够喜欢 &#x1f3e0;个人主页&#xff1a;晨犀主页 &#x1f9d1;个人简介&#xff1a;大家好&#xff0c;我是晨犀&#xff0c;希望我的文章可以帮助到大家&#xff0c;您的满意是我的动力…
阅读更多...
深入理解线程安全

深入理解线程安全

引言&#xff1a; 在多线程编程中&#xff0c;线程安全是一个至关重要的概念。线程安全可能到导致数据不一致&#xff0c;应用程序崩溃和其他不可预测的后果。本文将深入探讨线程安全问题的根本原因&#xff0c;并通过Java代码示例演示如何解决这些问题。 线程安全的根本原因 …
阅读更多...
element plus Infinite Scroll 无限滚动

element plus Infinite Scroll 无限滚动

欢迎关注我的公众号&#xff1a;夜说猫&#xff0c;让一个贫穷的程序员不靠打代码也能吃饭~ element plus官网中&#xff0c;Infinite Scroll示例使用的是数字&#xff0c;在实际项目运用中&#xff0c;我们更多的是使用json数组进行渲染&#xff0c;所以我们改写v-infinite-sc…
阅读更多...
Visual Studio2019报错

Visual Studio2019报错

1- Visual Studio2019报错 错误 MSB8036 找不到 Windows SDK 版本 10.0.19041.0的解决方法 小伙伴们在更新到Visual Studio2019后编译项目时可能遇到过这个错误&#xff1a;“ 错误 MSB8036 找不到 Windows SDK 版本 10.0.19041.0的解决方法”&#xff0c;但是我们明明安装了该…
阅读更多...
网络安全攻防对抗之隐藏通信隧道技术整理

网络安全攻防对抗之隐藏通信隧道技术整理

完成内网信息收集工作后&#xff0c;渗透测试人员需要判断流量是否出得去、进得来。隐藏通信隧道技术常用于在访问受限的网络环境中追踪数据流向和在非受信任的网络中实现安全的数据传输。 一、隐藏通信隧道基础知识 &#xff08;一&#xff09;隐藏通信隧道概述 一般的网络通…
阅读更多...
Python图像融合处理和 ROI 区域绘制基础

Python图像融合处理和 ROI 区域绘制基础

文章目录 一、图像融合二、图像 ROI 区域定位三、图像属性3.1 shape3.2 size3.3 dtype四、图像通道分离及合并4.1、split()函数4.2 merge()函数五、图像类型转换一、图像融合 图像融合通常是指多张图像的信息进行融合，从而获得信息更丰富的结果，能够帮助人们观察或计算机处理…
阅读更多...
微服务保护-隔离

微服务保护-隔离

个人名片&#xff1a; 博主&#xff1a;酒徒ᝰ. 个人简介&#xff1a;沉醉在酒中&#xff0c;借着一股酒劲&#xff0c;去拼搏一个未来。 本篇励志&#xff1a;三人行&#xff0c;必有我师焉。 本项目基于B站黑马程序员Java《SpringCloud微服务技术栈》&#xff0c;SpringCloud…
阅读更多...
SOAP WebService 发布服务成功，但是访问404

SOAP WebService 发布服务成功，但是访问404

原因 我这里是出在路由问题&#xff0c;因为一般我们都会配置WebServiceConfig&#xff0c;WebServiceConfig里又会定义ServletRegistrationBean&#xff0c;用于将一个Servlet注册到Web应用程序中&#xff0c;这里会配置上路径&#xff0c;如下&#xff1a; 但是项目有可能在…
阅读更多...
再战SDRAM与资料整理。

再战SDRAM与资料整理。

总之只要阅读操作手册&#xff0c;按照时序来&#xff0c;完全不难&#xff01; 器件记录&#xff1a; 小梅哥AC620上SDRAM&#xff1a;M12L2561616A-6TG2T 其的存储空间为16M*16256MB&#xff0c;第二行的数字则与其速度等级有关&#xff1b;其分为&#xff1a; 4bank*16bit…
阅读更多...
NLP（6）--Diffusion Model

NLP（6）--Diffusion Model

目录 一、Flow-Based General Model 1、概述 2、函数映射关系 3、Coupling Layer 4、Glow 二、Diffusion Model 1、概述 2、前向过程 3、反向过程 4、训练获得噪声估计模型 5、生成图片 三、马尔科夫链 一、Flow-Based General Model 1、概述 Flow-Based General…
阅读更多...
C 通过宏定义重定义malloc - free，预防内存泄露

C 通过宏定义重定义malloc - free，预防内存泄露

系列文章目录 C模版基础 文章目录 目录 代码地址 相关说明 使用案例 代码地址 GitHub - CHENLitterWhite/CPPWheel: CPP自封装的库 /* * 作者: 干饭小白 * 时间: 2023-09-25 16:00:00:00 * * 说明: * 只能检测 malloc 和 free,无法检测 new delete */ #pra…
阅读更多...
[Linux入门]---Linux指令②

[Linux入门]---Linux指令②

文章目录 Linux系统常用指令1.man指令2.echo3.cp指令&#xff08;重要&#xff09;4.mv指令&#xff08;重要&#xff09;&#xff1a;5.alias指令6.cat指令7.more指令8.less指令&#xff08;重要&#xff09;9.head指令10.tail指令11.时间相关的指令1.在显示方面2.在设定时间方…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023