Thymeleaf新手使用教程
Thymeleaf 基本语法
在 html 文件中使用 Thymelead 标签 需要在头文件中加入,否则无法使用它的标签
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">**1 基础表达式
1.1 变量表达式 ${……}**
姓名：type="text" name="userName" value="James Carrot" th:value="${person.name}" />以上是 html 内容，以下是 java 后台传送数据到前台
@RequestMapping("basicExpression")
public String basicExpression(Model model){
model.addAttribute("person",this.getPerson());
return "basic_expression";
}1.2 选择/星号表达式 *{……}
<div th:object="${person}">
<p>Name:
<span th:text="*{name}">Saturnspan>.
p>
<p>Age:
<span th:text="*{age}">30span>.
p>
<p>Phone:
<span th:text="*{phone}">1350992····span>.
p>
<p>Address:
<span th:text="*{address}">广州**科技span>.
p>
div>@RequestMapping("selectExpression")
public String selectExpression(Model model){
model.addAttribute("person",this.getPerson());
return "basic_expression_selection";
}1.3 文字国际化表达式 #{……}
Thymeleaf文字国际化需要springmvc的支持
1. 在资源目录 resources 下创建文件夹 spring-i18n 作为国际化文件的根目录，创建各种语言的 .properties文件存储需要使用的内容
2. 在 spring 配置文件中加入资源
<bean id="messageSource"
class="org.springframework.context.support.ResourceBundleMessageSource">
<property name="basename" value="spring-i18n/messages">property>
<property name="defaultEncoding" value="UTF-8"/>
bean>3.properties 文件内容
message.title=\u8fd9\u662f\u4e00\u4e2a\u6807\u98984.加入 html 代码
<h1 th:utext="#{message.title}">Hello Worldh1>@RequestMapping("i18nExpression")
public String i18nExpression(){
return "i18n_expression";
}1.4URL表达式 @{……}
**URL点击 ：<a href="details.html" th:href="@{myThymeleaf(orderId=${id})}">viewa>br>
相对路径：<img th:width="100px" th:src="@{../images/{imageUrl}(imageUrl=${image})}">br>
绝对路径：<img th:width="100px" th:src="@{/images/{imageUrl}(imageUrl=${image})}">br>
其他路径：<img th:width="100px" th:src="@{images/{imageUrl}(imageUrl=${image})}">**@RequestMapping("urlExpression")
public String urlExpression(Model model){
model.addAttribute("id",10);
model.addAttribute("image","001.jpg");
return "url_expression";
}2 Thymeleaf 常用标签
2.1 普通标签
Thymeleaf中大部分标签都是与html原有属性对应的，比如html中script标签的src属性，在Thymeleaf中对应th:src标签，这样通过静态解析的时候，浏览器会读取src属性对应的js，而通过动态解析访问的时候，浏览器拿到的src即为th:src中的内容。
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>常用普通标签-ThymeLeaf 模板引擎title>
head>
<body>
<input type="text" name="name" th:value="ThymeleafValue" value="HtmlValue">
<img src="../images/001.jpg" width="200px" th:width="100px" th:src="@{../images/001.jpg}">br>
<script type="text/javascript" src="../js/myThymeleaf.js" th:src="@{/js/myThymeleaf.js}">script>
body>
html>2.2 常用标签
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>常用普通标签-ThymeLeaf 模板引擎title>
head>
<body>
<p>简单数据转换：p>
<dt>年龄dt>
<dd th:text="${#numbers.formatDecimal(person.age, 1, 2)}">25dd>
<dt>生日dt>
<dd th:text="${#dates.format(person.birthday, 'yyyy-MM-dd')}">2014-12-01dd>
<p>字符串拼接p>
<dt>地址dt>
<dd th:text="${'广东省'+person.address}">越秀区dd>
<p>表单p>
<form th:action="@{/vic/person}" th:object="${person}" method="post" th:method="post">
<dt>姓名：<input type="text" th:field="*{name}"/>dt>
<dt>年龄：<input type="text" th:field="*{age}"/>dt>
<dt>电话：<input type="text" th:field="*{phone}"/>dt>
<dt>地址：<input type="text" th:field="*{address}"/>dt>
<dt>生日：<input type="text" th:field="*{birthday}"/>dt>
<dt><input type="submit"/>
form>
body>
html>**2.3 常用工具
工具对象表达式。常用于日期、集合、数组对象的访问。这些工具对象就像是java对象，可以访问对应java对象的方法来进行各种操作。有#maps、#dates、#calendars、#numbers、#lists等**
<p>工具对象表达式。常用于日期、集合、数组对象的访问。
这些工具对象就像是java对象，可以访问对应java对象的方法来进行各种操作。p>
<p>#maps、#dates、#calendars、#numbers、#lists等p>
<p>简单数据转换：p>
<dt>#numbers：年龄dt><dd th:text="${#numbers.formatDecimal(person.age, 1, 2)}">25dd>
<dt>#dates：生日dt><dd th:text="${#dates.format(person.birthday, 'yyyy-MM-dd')}">2014-12-01dd>
<dt>#calendars：生日dt><dd th:text="${#calendars.format(person.birthday, 'dd MMMM yyyy')}">2014-12-01dd>
<div th:if="${#maps.isEmpty(persons)}">
<p>#maps:判断对象是否为空p>
div>
<div>
#lists:<span th:text="${#lists.size(personList)}">span>
div>
<div th:with="sizes=${#lists.size(personList)}">
<h3>当前数据长度：<span th:text="${sizes}">span>h3>
div>
<div>
#httpServletRequest: <span th:text="${#httpServletRequest.getParameter('ids')}">span>
div>2.3 循环、IF、Switch
<body>
<div>
<span th:if="${switch > 8}"> 判断大于8 显示span>
<span th:if="${switch > 32}"> 判断大于32 不显示span>
div>
--------------------------------------------------
<div>
<span th:unless="${switch > 8}"> 判断大于8 显示span>
<span th:unless="${switch > 32}"> 判断大于32 不显示span>
div>
<div th:switch="${switch}">
<p th:case="'admin'">User is an administratorp>
<p th:case="30">User is a managerp>
<p th:case="20">User is a managerp>
<p th:case="*">User is some other thingp>
div>
-- 循环 --
<div th:if="${personList!=null}">
<table>
<tr th:each="person : ${personList}">
<td th:text="${person.name}">td>
<td th:text="${person.age}">td>
<td th:text="${person.address}">td>
tr>
table>
div>
body>项目中被用到的 Thymeleaf 标签 - 片段（th:fragment）
<div th:fragment="editUserFragment">
….内容
div>userCenter.html 引用一个片段
<div th:replace="userManager/editUser::editUserFragment">div>