Thymeleaf模板引擎的使用_模板引擎如何使用-CSDN博客

本文链接：https://blog.csdn.net/sinat_36230171/article/details/138175500

1.添加依赖

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

2.引入标签库

<html xmlsns:th="http://www.thymeleaf.org">

3.标签库的使用

Thymeleaf模板默认将JS脚本、CSS样式、图片等静态文件放置在src/main/resources/static目录下。
将视图页面放在src/main/resources/templates目录下。

3.1.常见使用

1)引入URL

		<link rel="stylesheet" th:href="@{css/bootstrap.min.css}" />
		<a th:href="@{http://www.baidu.com/}">百度</a>

2)引入图片

		<img  th:src="'images/'+${aBook.picture}" />

3)输出内容

<div th:object = "${session.user}">
<!--fistName为user对象的属性-->
		name:<span th:text=" * {firstName}" ></span><br>
		surname:<span th:text=" * {lastName}" ></span><br>
		nationality:<span th:text=" * {nationnality}" ></span><br>
</div>

4)基本表达式

		<p th:text="#{test.myText}" />
		<!--加粗-->
		<p th:utext="#{test.myText}" />

5)支持+、-、*、/、%等算术运算和>,<,>=,<=,==,!=等各种逻辑运算

   	<tr th:class="( ${row}=='even)?'even':'odd'" >...</tr>
   	<!--加粗-->
   	<p th:utext="#{test.myText}" />

6)条件判断if和unless以及switch

   	 <!--if和unless-->
   	<a href="success.xhtml": th:if="${user!=null}" >成功</a>
   	<a href="success.xhtml": th:unless="${user==null}" >成功</a>
   	<!--switch-->
   	<div th:switch = "${user.role}">
   			<p th:case=" 'admin'" >User is an administrator</p>
   			<p th:case=" 'teacher'" >User is a teacher</p>
   			<p th:case=" '*'" >User is a student</p>
   	</div>

7)循环

<!--1）基本循环-->
<div class="col-md-4 col-sm-6" th:each = "book:${books}">
   	<a href="" >
   		<img th:src="'images/' + ${book.picture}" alt="图书封面" style="height:180px;width:40%;"/>
   	</a>
   	<div class="caption">
   	<h4 th:text=" ${book.bname}" ></h4>
   	<p th:text="${book.author}" ></p>
   	<p th:text="${book.isbn}" ></p>
   	<p th:text="${book.price}" ></p>
   	<p th:text="${book.publishing}" ></p>
   	</div>
</div>
<!--1）循环状态的使用
th: each ="obj, iterStat: ${objList}"
在th: each 标签中可以使用循环状态变量，该变量有如下属性。
index: 当前迭代对象的index（从0开始计数）
count: 当前迭代对象的index（从1开始计数）
size: 迭代对象的大小
current: 当前迭代变量
even/odd: 布尔值，当前循环是否是偶数/奇数（从0开始计数）
first: 布尔值，当前循环是否是第一个
last: 布尔值，当前循环是否是最后一个
实例如下
-->
<div class="col-md-4 col-sm-6" th:each = "book，bookStat:${books}">
   	<a href="" >
   		<img th:src="'images/' + ${book.picture}" alt="图书封面" style="height:180px;width:40%;"/>
   	</a>
   	<div class="caption">
   	<!--1）循环状态bookStat-->
   	<h3 th:text=" ${bookStat.count}" ></h3>
   	<h4 th:text=" ${book.bname}" ></h4>
   	<p th:text="${book.author}" ></p>
   	<p th:text="${book.isbn}" ></p>
   	<p th:text="${book.price}" ></p>
   	<p th:text="${book.publishing}" ></p>
   	</div>
</div>

3.2.内置对象的使用

常见的内置对象如下

#dates: 日期格式化的内置对象，为java.util.Date类的方法
#calendars: 类似于#dates,为java.util.Calendar类的方法
#numbers: 数字格式化的内置对象
#strings: 字符串格式化的内置对象
#objects: 参照java.lang.Object
#bools: 判断boolean的内置对象
#arrays: 数组操作的内置对象
#lists: 列表操作的内置对象，参照java.util.List
#sets: Set操作的的内置对象，参照java.util.Set
#maps: Map操作的内置对象，参照java.util.Map
#aggregates: 创建数组或集合的聚合的内置对象。
#messages: 在变量表达式内部获取外部消息的内置对象。
假如有如下控制器方法：

html代码如下:

<! DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Insert title here</title>
</head>
<body>
	格式化控制器传递过来的系统时间 
	<span th:text="${#dates.format(nowTime,'yyyy/MM/dd')}"></span><br>
	创建一个日期对象
	<span th:text="${#dates.create(2019,6,13)}"></span><br>
	格式化控制器传递过来的系统日历
	<span th:text="${#calendars.format(nowCalendar,'yyyy-MM-dd')}"></span><br>
	格式化控制器传递过来的BigDecimal对象myMoney:
	<span th:text="${#numbers.formatInteger(myMoney,3)}"></span><br>
	计算控制器传递过来的字符串str的长度:
	<span th:text="${#strings.length(str)}"></span><br>
	返回对象，当控制器传递过来的BigDecimal对象myMoney为空时，返回默认值9999:
	<span th:text="${#objects.nullSafe(myMoney,9999)}"></span><br>
	判断boolean数据是否是false:
	<span th:text="${#bools.isFalse(bool)}"></span><br>
	判断数组mya中是否包含元素5:
	<span th:text="${#arrays.contains(mya,5)}"></span><br>
	排序列表myList1的数据:
	<span th:text="${#lists.sort(myList1)}"></span><br>
	判断集合mySet中是否包含元素set2:
	<span th:text="${#sets.contains(mySet,'set2')}"></span><br>
	判断集合myMap中是否包含key1关键字:
	<span th:text="${#maps.contains(myMap,'key1')}"></span><br>
	将数组mya中的元素求和:
	<span th:text="${#aggregates.sum(mya)}"></span><br>
	将数组mya中的元素求平均:
	<span th:text="${#aggregates.avg(mya)}"></span><br>
	如果未找到消息，则返回默认消息（如“??msgKey_zh_CN??”）；
	<span th:text="${#messages.msg(msgKey)}"></span><br>
</body>
</html>

3.3.常用属性

1 th: action类似表单的action
2 th: each类似<c: foreach>
3 th: field常用于表单参数绑定，通常与th: object一起使用
4 th: href超链接使用
5 th: id类似于html中的id
6 th: if用于条件判断
7 th: fragment声明定义该属性的div为模板片段，常用于头文件、页尾文件的引入。
8 th: object用于表单数据对象绑定
9 th: src类似于<script>标签的src属性
10 th: text文本显示
11 th: value用于标签赋值
12 th: style用于修改style标签
13 th: onclick用于修改单击事件
th: fragment用例如下：

<! DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Insert title here</title>
</head>
<body>
	<!-- 声明片段content-->
	<div th:fragment="content">
	主体内容
	</div>
	<!-- 声明片段copy-->
	<div th:fragment="copy">
	©清华大学出版社
	</div>
</body>
</html>
<!-- 另一个页面-->
<! DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Insert title here</title>
</head>
<body>
测试SpringBoot的Thymeleaf支持<br>
	引入主体内容模板片段：
	<div th:include="footer::content"></div>
	引入版权所有模板片段：
	<div th:replace="footer::copy"></div>
</body>
</html>