存放位置:resources\templates

访问方式:通过Controller请求访问,不可直接访问(相当于web项目的WEB-INF目录)

环境依赖:

<!--thymeleaf模板支持-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

命名空间:

<html lang="en" xmlns:th="http://www.thymeleaf.org">

相关配置:

#thymeleaf 配置
spring:
thymeleaf:
cache: false #开发时关闭缓存,不然没法看到实时页面
prefix: classpath:/templates/ #文件存放路径
suffix: .html #文件后缀
encoding: utf-8
mode: HTML5
servlet:
content-type: text/html
mvc:
static-path-pattern: /** #静态资源加载路径

相关参考:

https://www.cnblogs.com/itdragon/archive/2018/04/13/8724291.html

1、th:text:文本显示标签

controller设置变量值:

model.addAttribute("msg1","<h1>我是h1变量</h1>");

thymeleaf标签取值:

<!--th:text: 文本显示常量-->
<span th:text="'我是thymeleaf常量'"></span> <br /><br /> <!--th:text: 可以直接写运算表达式-->
<span th:text="1+2"></span> <br /><br /> <!--th:text: 文本显示controller中的变量-->
<span th:text="${msg1}"></span> <br /><br /> <!--th:utext: 文本显示controller中的变量(转义)-->
<span th:utext="${msg1}"></span> <br /><br />

打印结果:

2、th:value:value显示标签

controller设置变量值:

model.addAttribute("msg","我是thymeleaf变量");

thymeleaf标签取值:

<!--th:value: value显示controller中的变量-->
<input type="text" th:value="${msg}"> <br /><br />

打印结果:

3、对象取值

controller设置变量值:

/*java bean*/
User user = new User("king",33); /*map*/
Map<String,Object> mp = new HashMap<>();
mp.put("mpkey","mapValue"); model.addAttribute("user",user);
model.addAttribute("mp",mp);

thymeleaf标签取值:

<!--对象取值方式1 ${对象.属性}-->
<div>
<p th:text="${user.name}"></p>
<p th:text="${user.age}"></p>
</div> <!--对象取值方式2 th:object-->
<div th:object="${user}">
<p th:text="*{name}"></p>
<p th:text="*{age}"></p>
</div> <!--map取值-->
<p th:text="${mp.get('mpkey')}"></p>

打印结果:

4、IF 判断

controller设置变量值:

/*List集合*/
List<User> lists = new ArrayList<>();
for (int i = 1; i <=4 ; i++) {
User u = new User("king"+i,i);
lists.add(u);
} model.addAttribute("lists",lists); model.addAttribute("gender","男");

thymeleaf标签取值:

<!--IF判断-->
<!--判断list集合为空-->
<div th:if="${#lists.isEmpty(lists)}" th:text="'list集合为空'"></div> <!--判断list集合非空-->
<div th:if="${not #lists.isEmpty(lists)}" th:text="'list集合非空'"></div> <!--判断变量等于一个值-->
<div th:if="${gender == '男'}" th:text="'我是男孩'"></div>

打印结果:

5、each循环

controller设置变量值:

/*List集合*/
List<User> lists = new ArrayList<>();
for (int i = 1; i <=4 ; i++) {
User u = new User("king"+i,i);
lists.add(u);
} model.addAttribute("lists",lists);

thymeleaf标签取值:

<!--list迭代-->
<table border="1">
<tr >
<td th:text="下标" ></td>
<td th:text="name值"></td>
<td th:text="age值"></td>
<td th:text="总数"></td>
</tr>
<tr th:each="user,status: ${lists}">
<td th:text="${status.index}" ></td> <!--获取下标-->
<td th:text="${user.name}"></td>
<td th:text="${user.age}"></td>
<td th:text="${status.count}"></td> <!--获取数量-->
</tr>
</table>

打印结果:

6、switch case

controller设置变量值:

model.addAttribute("gender","男");

thymeleaf标签取值:

<!--switch迭代-->
<div th:switch="${gender}">
<p th:case="'男'">我是男孩</p>
<p th:case="'女'">我是女孩</p>
<p th:case="'*'">未知性别</p>
</div>

打印结果:

7、时间格式化

controller设置变量值:

model.addAttribute("nowDate",new Date());

thymeleaf标签取值:

<!--时间格式化-->
<p th:text="${#dates.format(nowDate,'yyyy-MM-dd HH:mm:ss')}"></p>

打印结果:

8、session

controller设置变量值:

session.setAttribute("userId","10010");

thymeleaf标签取值:

<!--从session获取值-->
<p th:text="${session.userId}"></p>

打印结果:

9、request

controller设置变量值:

request.setAttribute("rmsg","我是request");

thymeleaf标签取值:

<!--从request获取值-->
<p th:text="${#request.getAttribute('rmsg')}"></p>

打印结果:

10、代码块

语法推荐:~{templatename::fragmentname}

templatename:模版名,Thymeleaf会根据模版名解析完整路径:/resources/templates/templatename.html,要注意文件的路径。

fragmentname:片段名,Thymeleaf通过th:fragment声明定义代码块,即:th:fragment="fragmentname"

代码块表达式的使用
代码块表达式需要配合th属性(th:insert,th:replace,th:include)一起使用。 th:insert:将代码块片段整个插入到使用了th:insert的HTML标签中, th:replace:将代码块片段整个替换使用了th:replace的HTML标签中, th:include:将代码块片段包含的内容插入到使用了th:include的HTML标签中,

示例:

1:在templates下创建头部公共代码块header.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"> <header th:fragment="head"> <p>我是头部</p> </header> </html>

2:在templates下创建底部公共代码块header.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"> <!--fragment可以传参数-->
<footer th:fragment="foot(value1,value2)"> <p th:text="${value1} + '--' + ${value2} + ' 我是底部'"></p> </footer> </html>

3:在templates下创建主页面main.html,引入头部和底部

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body> <!--引入头部-->
<div th:replace="header::head"></div> <p th:text="'我是主内容'"></p> <!--引入底部-->
<div th:replace="footer::foot('2019年','2020年')"></div> </body>
</html>

4:运行效果

11、链接表达式

无参:@{/xxx}

有参:@{/xxx(k1=v1,k2=v2)} 对应url结构:xxx?k1=v1&k2=v2

引入本地资源:@{/项目本地的资源路径}

引入外部资源:@{/webjars/资源在jar包中的路径}

资源路径:

示例:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title> <!-- 加载css样式 -->
<link th:href="@{/asserts/css/bootstrap.min.css}" rel="stylesheet"> <!-- 加载js样式 -->
<script type="text/javascript" th:src="@{asserts/js/bootstrap.min.js}"></script> </head>
<body> <!--图片-->
<img th:src="@{asserts/img/bootstrap-solid.svg}" alt="" width="72" height="72"> <!--超链接-->
<a th:href="@{/login.html(l='zh_CN')}" >中文</a>
<a th:href="@{/login.html(l='en_CN')}" >英文</a> <!--form表单-->
<form th:action="@{/form.html}" th:method="post">
<input type="text" name="username">
<input type="submit" value="提交">
</form> </body>
</html>
@RequestMapping("/login.html")
public String login(String l){
System.out.println(l);
return "main";
} @RequestMapping("/form.html")
public String loginForm(String username){
System.out.println(username);
return "main";
}

Springboot:thymeleaf模板(八)的更多相关文章

  1. SpringBoot thymeleaf模板页面没提示,SpringBoot thymeleaf模板插件安装

    SpringBoot thymeleaf模板插件安装 SpringBoot thymeleaf模板Html页面没提示 SpringBoot  thymeleaf模板页面没提示 SpringBoot t ...

  2. SpringBoot thymeleaf模板版本,thymeleaf模板更换版本

    SpringBoot thymeleaf模板版本 thymeleaf模板更换版本 修改thymeleaf模板版本 ================================ ©Copyright ...

  3. springboot+thymeleaf 模板中传递参数误报错误 红色波浪线

    在使用IDEA开发SpringBoot项目时,使用了Thymeleaf模板引擎,在使用动态传参数时,HTML页面的动态参数出现了红色波浪线,情况如下如: 解决办法: 选择 File -> Set ...

  4. JavaEE开发之SpringBoot整合MyBatis以及Thymeleaf模板引擎

    上篇博客我们聊了<JavaEE开发之SpringBoot工程的创建.运行与配置>,从上篇博客的内容我们不难看出SpringBoot的便捷.本篇博客我们继续在上篇博客的基础上来看一下Spri ...

  5. (二)springboot整合thymeleaf模板

    在我们平时的开发中,用了很久的jsp作view显示层,但是标签库和JSP缺乏良好格式的一个副作用就是它很少能够与其产生的HTML类似.所以,在Web浏览器或HTML编辑器中查看未经渲染的JSP模板是非 ...

  6. (二)SpringBoot基础篇- 静态资源的访问及Thymeleaf模板引擎的使用

    一.描述 在应用系统开发的过程中,不可避免的需要使用静态资源(浏览器看的懂,他可以有变量,例:HTML页面,css样式文件,文本,属性文件,图片等): 并且SpringBoot内置了Thymeleaf ...

  7. 【Springboot】Springboot整合Thymeleaf模板引擎

    Thymeleaf Thymeleaf是跟Velocity.FreeMarker类似的模板引擎,它可以完全替代JSP,相较与其他的模板引擎,它主要有以下几个特点: 1. Thymeleaf在有网络和无 ...

  8. SpringBoot系列——Thymeleaf模板

    前言 thymeleaf是springboot官方推荐使用的java模板引擎,在springboot的参考指南里的第28.1.10 Template Engines中介绍并推荐使用thymeleaf, ...

  9. SpringBoot 之Thymeleaf模板.

    一.前言 Thymeleaf 的出现是为了取代 JSP,虽然 JSP 存在了很长时间,并在 Java Web 开发中无处不在,但是它也存在一些缺陷: 1.JSP 最明显的问题在于它看起来像HTML或X ...

随机推荐

  1. 装numpy 环境:python3.4+ windows7 +64位系统

    机器学习实战python 因为图像处理的原因,初步学习机器学习,选用语言python,参考书籍<机器学习实战> 环境:python3.4+ windows7 +64位系统 首先,今天解决的 ...

  2. C 实战练习题目2

    题目:企业发放的奖金根据利润提成. 利润(I)低于或等于10万元时,奖金可提10%: 利润高于10万元,低于20万元时,低于10万元的部分按10%提成,高于10万元的部分,可提成7.5%: 20万到4 ...

  3. TensorFlow 基本变量定义,基本操作,矩阵基本操作

    使用 TensorFlow 进行基本操作的实例,这个实例主要是使用 TensorFlow 进行了加法运算. 包括使用 constant 常量进行加法运算和使用 placeholder 进行变量加法运算 ...

  4. [洛谷1437&Codevs1257]敲砖块<恶心的dp>

    题目链接:https://www.luogu.org/problem/show?pid=1437#sub http://codevs.cn/problem/1257/ 不得不说,这个题非常的恶心,在初 ...

  5. 200行PYTHON代码实现贪吃蛇

    200行Python代码实现贪吃蛇 话不多说,最后会给出全部的代码,也可以从这里Fork,正文开始: 目前实现的功能列表: 贪吃蛇的控制,通过上下左右方向键: 触碰到边缘.墙壁.自身则游戏结束: 接触 ...

  6. 操作系统-IO与显示器

    1. 让外设工作起来 只要给相应的控制器中的寄存器发一个指令 向设备控制器的寄存器写不就可以了吗? 需要查寄存器地址.内容的格式和语义.操作系统需要给用户提供一个简单视图---文件视图,这样方便 总的 ...

  7. Python学习-第五节:面向对象

    概念: 核心是“过程”二字,“过程”指的是解决问题的步骤,即先干什么再干什么......,基于面向过程设计程序就好比在设计一条流水线,是一种机械式的思维方式.若程序一开始是要着手解决一个大的问题,面向 ...

  8. 使用jdbc实现简单的mvc模式的增删改查

    Mvc模式设计: 视图:添加界面(addUser.jsp),修改界面(updateUser.jsp),显示页面(allUser.jsp) 控制器:添加信息控制器(AddUserServlet),修改信 ...

  9. js检查数据类型

    在实际工作中我们经常遇到要检测传入的参数类型是什么.也许第一时间想的的是typeof ,但这个也只是能检测个别的一些类型.如果要检测null,Array这些类型呢? 所以我们可以封装一个方法可以更加方 ...

  10. 下载腾讯视频mp4格式

    import time import subprocess import argparse def command(cmd, timeout=60): ''' :param cmd: 执行命令cmd, ...