Thymeleaf的优点

  • Java模板引擎，能够处理HTML、XML、JavaScript、CSS甚至是纯文本，类似于JSP、Freemarker
  • 自然模板，原型即页面
  • 语法优雅易懂，可以使用OGNL、SpringEL
  • 遵从WEB标准，支持HTML5

标准方言

  • <span th:text="...">：需要引入Thymeleaf的命名空间
  • <span data-th-text="...">：HTML5的标准，可以省略引入命名空间

内容

标准表达式

变量表达式

语法：${...}

例子：<span th:text="${对象.属性.属性}">

消息表达式

语法：#{...}

例子：<th th:text="#{header.address.city}">...</th>

也叫做文本外部化、国际化或者i18n

选择表达式

语法：*{...}

与变量表达式的区别：它们是在当前选择的对象而不是整个上下文变量映射上执行

相对变量表达式有一定优化作用

链接表达式

语法：@{...}

表达式路径可以是：

  1. 相对路径：<a th:href="@{../documents/report}">...</a>
  2. WEB应用路径：<a th:href="@{/documents/report}">...</a>
  3. 服务器相对路径：<a th:href="@{~/documents/report}">...</a>
  4. 协议相对：<a th:href="@{//static.ydblog.com/documents/report}">...</a>
  5. 绝对路径：<a th:href="@{https://www.ydblog.com/documents/report}">...</a>

分段表达式

语法：th:insert或者th:replace

声明片段：<div th:fragment="copy">...</div>

使用：<div th:insert="~{模板名：片段名}">...</div>

字面量(文字)

例子：

  1. <span th:text="'application'">...</span>
  2. <span th:text="1024">...</span>
  3. <span th:if="xxx==false">...</span>
  4. <span th:if="xxx==null">...</span>
  5. +,-,*,/,%
  6. <,>,<=,>=或者gt,lt,ge,le(解决标签冲突)
  7. ==,!=或者eq,ne
  8. xxx?true:false三目运算符
  9. _无操作，例子：<span th:text="${user.isNull()}?'存在':_">如果不存在，取原文本</span>

还有一个th:utext：th:utext会解析Html，而th:text不会解析

设置属性值

设置任意属性值

例子：

  1. <form th:attr="action=@{/project}">...</form>
  2. <input type="submit" value="submit" th:attr="value=#{submit.value}"/>

相较于指定的属性值，这种方法可以自定义属性

设置指定的属性值

例子：

  1. <form th:action="@{/project}">...</form>
  2. <input type="submit" value="submit" th:value="#{submit.value}"/>

常见：th:href,th:value,…

支持的指定属性可以查看官方文档

固定值布尔属性

例子：

Html：<select>...<option selected="selected">...</option>...</select>

Thymeleaf：<select>...<option th:selected="${option.isSelected}">...</option>...</select>

常见：th:selected,th:readonly,th:required,th:disabled,…

迭代器

基本：th:each

例子：<li th:each="book : ${books}" th:text="${book.title}">...</li>

状态变量：

  1. index从0开始
  2. count从1开始
  3. size迭代器元素总数
  4. current当前元素
  5. even/odd奇数/偶数
  6. first 是否为第一个
  7. last …

条件语句

th:if、th:unless

th:switch和th:case

模板布局

定义片段：th:fragment

引用片段：

  1. th:insert：保留自己的主标签，保留fragment的主标签
  2. th:replace：不要自己的主标签，使用fragment的主标签
  3. th:include：保留自己的主标签，不要fragment的主标签，3.0版本之后不推荐使用

th:insert="~{模板名：片段名}"也可以简写成：th:insert="模板名：片段名"

也可以使用ID选择器来：

引用片段：th:insert="~{模板名：#选择器名}"

属性优先级

看看官方文档：

图1

注释

标准的Html/XML注释

1
<!-- info -->

Thymeleaf解析器级注释块

<!--/*和*/-->之间的内容

1
2
3
<!--/*-->
	<span>在静态页面可以显示的内容，在Thymeleaf模板解析时会被注释掉</span>
<!--*/-->

原型注释块

<!--/*/和/*/-->之间的内容

1
2
3
<!--/*/
	<span>在静态页面被注释的内容，在Thymeleaf模板解析时可以显示</span>
/*/-->

内联

内联表达式

语法：

  1. [[...]]对应th:text
  2. [(...)]对应th:utext

禁用内联

语法：th:inline="none"

例子：<p th:inline="none">这是一个二维数组：[[1,2,3],[4,5,6]]</p>

JavaScript内联

例子：

1
2
3
4
5
<script th:inline="javascript">
    ...
    var username= /*[[$(session.user.name)]]*/ "Tom";
    ...
</script>

结果

1
2
3
4
5
<script>
    ...
    var username= "Tom \"cat\";
    ...
</script>

css内联

1
2
3
4
5
<style th:inline="css">
    .[[${classname}]] {
        text-align: [[${align}]];
    }
</style>
1
2
3
4
5
<style>
    .main\ elems{
        text-align: center;
    }
</style>

表达式的基本对象

基本对象

  1. #ctx 上下文对象，是 org.thymeleaf.context.IContext或者org.thymeleaf.context.IWebContext的实现
  2. #locale 直接访问与java.util.Locale的关联对象
  3. request检索请求
  4. session检索session属性
  5. application 用于检索application/servlet上下文属性

Web上下文对象

  1. #request 对应javax.servlet.http.HttpServletRequest对象
  2. #session 对应javax.servlet.http.HttpSession对象
  3. #servletContext 对应javax.servlet.ServletContext对象

工具对象(常用)

Datas

1
${#datas.format(date,"dd/MMM/yyyy HH:mm:ss")}

Strings

1
${#strings.isEmpty(name)}

集合

1
2
3
4
${#arrays.toArray(object)}
${#lists.toList(object)}
${#sets.toSet(object)}
${#maps.size(object)}