Thymeleaf是一款用于渲染XML/XHTML/HTML5内容的模板引擎，类似JSP，Velocity，FreeMaker等，它也可以轻易的与Spring MVC等Web框架进行集成作为Web应用的模板引擎。
Thymeleaf最大的特点是能够直接在浏览器中打开并正确显示模板页面，而不需要启动整个Web应用，但是总是看到说其效率有点低。
Thymeleaf 在有网络和无网络的环境下皆都可以运行，即它可以让美工在浏览器查看页面的静态效果，也可以让程序员在服务器查看带数据的动态页面效果。这是由于它支持 html 原型，然后在 html 标签里增加额外的属性来达到模板+数据的展示方式。
浏览器解释 html 时会忽略未定义的标签属性，所以 thymeleaf 的模板可以静态地运行；当有数据返回到页面时，Thymeleaf 标签会动态地替换掉静态内容，使页面动态显示。
Thymeleaf 开箱即用的特性。它提供标准和spring标准两种方言，可以直接套用模板实现JSTL、 OGNL表达式效果，避免每天套模板、改jstl、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
引入 Thymeleaf修改 html 标签用于引入 thymeleaf 引擎，这样才可以在各html标签里使用 th:* 语法。
![]()
标签只有在 th:if 中条件成立时才显示：
view
示例：
DOCTYPE html>
修改用户
修改用户
账户：
昵称：
性别：男
女
th:unless 于 th:if 恰好相反，只有表达式中的条件不成立，才会显示其内容。
view
Thymeleaf 同样支持多路选择 Switch 结构：
User is an administrator
User is a manager
默认属性 default 可以用 \* 表示：
User is an administrator
User is a manager
User is some other thing
渲染列表数据是一种非常常见的场景，例如现在有 n 条记录需要渲染成一个表格，该数据集合必须是可以遍历的，使用 th:each 标签。
- 示例一
Onions
2.41
yes
NAME
PRICE
IN STOCK
Onions
2.41
yes
迭代器的状态：
-
index：当前的索引，从0开始
-
count：当前的索引，从1开始
-
size：总数
-
current：当前迭代变量
-
even/odd：布尔值，当前循环是否是偶数/奇数（从0开始计算）
-
first：布尔值，当前循环是否是第一个
-
last：布尔值，当前循环是否是最后一个
-
示例二
NAME
PRICE
IN STOCK
Onions
2.41
yes
Return to home
可以看到，需要在被循环渲染的元素（这里是）中加入 th:each 标签，其中 th:each="prod : ${prods}" 意味着对集合变量 prods 进行遍历，循环变量是 prod 在循环体中可以通过表达式访问。
- 后台代码
@GetMapping("fun3")
public ModelAndView fun3(ModelAndView mav){
mav.addObject("thText", "th:text 设置文本内容 加粗");
mav.addObject("thUText", "th:utext 设置文本内容 加粗");
mav.addObject("thValue", "thValue 设置当前元素的value值");
mav.addObject("thEach", Arrays.asList("张三", "李四","王二","麻子"));
mav.addObject("thIf", "msg is not null");
mav.addObject("thObject", new Dept(10,"sales","CHICAGO"));
mav.setViewName("index");
return mav;
}
- 前端代码
Thymeleaf 语法
-
-
- 效果
变量表达式功能：
- 可以获取对象的属性和方法
- 可以使用ctx，vars，locale，request，response，session，servletContext内置对象
- 可以使用dates，numbers，strings，objects，arrays，lists，sets，maps等内置方法
示例：
name
获取变量值用 $ 符号，对于javaBean的话使用 变量名.属性名 方式获取，这点和 EL 表达式一样。 $ 表达式只能写在th标签内部，不然不会生效。上面例子就是使用 th:text 标签的值替换 p 标签里面的值，至于 p 里面的原有的值只是为了给前端开发时做展示用的，这样的话很好的做到了前后端分离.
链接表达式好处：不管是静态资源的引用，form表单的请求，凡是链接都可以用@{…} 。这样可以动态获取项目路径，即便项目名变了，链接表达式会自动修改路径，依然可以正常访问
链接表达式结构：
- 无参：
@{/xxx} - 有参：
@{/xxx(k1=v1,k2=v2)} 对应url结构：xxx?k1=v1&k2=v2
引入资源：
- 引入本地资源：
@{/项目本地的资源路径} - 引入外部资源：
@{/webjars/资源在jar包中的路径}
示例：
绝对路径
相对路径
Content路径,默认访问static下的css文件夹
中文
English
类似的标签有:th:href 和 th:src
消息表达式一般用于国际化的场景。
~{…} 代码块表达式代码块表达式需要配合th属性（th:insert，th:replace，th:include）一起使用：
- th:insert：将代码块片段整个插入到使用了th:insert的HTML标签中
- th:replace：将代码块片段整个替换使用了th:replace的HTML标签中
- th:include：将代码块片段包含的内容插入到使用了th:include的HTML标签中
代码块表达式支持两种语法结构：
- 支持：~{templatename::#id}
- 推荐：~{templatename::fragmentname} 其中：
- templatename：模版名，Thymeleaf会根据模版名解析完整路径：/resources/templates/templatename.html，要注意文件的路径。
- fragmentname：片段名，Thymeleaf通过th:fragment声明定义代码块，即：th:fragment=“fragmentname”
- id：HTML的id选择器，使用时要在前面加上#号，不支持class选择器。
示例
- 后台代码
@RequestMapping("demo3")
public String demo3(ModelMap modelMap) {
modelMap.put("itStr", "HelloWorld");
modelMap.put("itNum", 888.888D);
modelMap.put("itBool", true);
modelMap.put("itArray", new Integer[]{1,2,3,4});
modelMap.put("itList", Arrays.asList(1,3,2,4,0));
Map itMap = new HashMap();
itMap.put("thName", "${#...}");
itMap.put("desc", "变量表达式内置方法");
modelMap.put("itMap", itMap);
modelMap.put("itDate", new Date());
return "demo3";
}
- 前面代码
DOCTYPE html>
IT Thymeleaf 内置方法
#strings
Old Str :
toUpperCase :
toLowerCase :
equals :
equalsIgnoreCase :
indexOf :
substring :
replace :
startsWith :
contains :
#numbers
formatDecimal 整数部分随意，小数点后保留两位，四舍五入:
formatDecimal 整数部分保留五位数，小数点后保留两位，四舍五入:
#bools
#arrays
length :
contains :
containsAll :
#lists
size :
contains :
sort :
#maps
size :
containsKey :
containsValue :
#dates
format :
custom format :
day :
month :
monthName :
year :
dayOfWeekName :
hour :
minute :
second :
createNow :
- 结果：
很多时候可能我们只需要对一大段文字中的某一处地方进行替换，可以通过字符串拼接操作完成：
简洁方式：
当然这种形式限制比较多，|…|中只能包含变量表达式${…}，不能包含其他常量、条件表达式等。
运算符在表达式中可以使用各类算术运算符，例如+, -, *, /, %
th:with="isEven=(${prodStat.count} % 2 == 0)"
逻辑运算符>, ">> 1" th:text="'Execution mode is ' + ( (${execMode} == 'dev')? 'Development' : 'Production')" th:block
...
...
...
推荐下面写法（编译前看不见）
...
...
...
