thymeleaf

thymeleaf的主要目标是将优雅的自然模板带到开发工作流程中，并在HTML浏览器中正确显示，并且可以作为静态原型，让开发团队更容易地协作。Thymeleaf能够处理HTML、XML、JavaScript、CSS甚至纯文本。

基本使用

添加依赖

  1. <dependency>
  2.   <groupId>org.springframework.boot</groupId>
  3.   <artifactId>spring-boot-starter-thymeleaf</artifactId>
  4. </dependency>

注意事项：

  • SpringBoot 管理的 thymeleaf 管理的版本可能较低，可以通过 maven 的 properties 属性覆盖（继承父项目）或者在 dependencyManagement 中的 spring-boot-dependencies 之前导入新的 thymeleaf 依赖
  • thymeleaf 3 对应 layout 2.x 版本， thymeleaf 2 对应 layout 1.x 版本
  • template属于安全目录，不允许外部基于url直接访问，跟static不一样


添加 Controller

  1. @Controller
  2. public class ThymeleafController {
  3.     @GetMapping("/index")
  4.     public String showPage(Model model) {
  5.         model.addAttribute("msg","Thymeleaf测试");
  6.         return "index";
  7.     }
  8. }

添加页面

resources/template/index.html：

  1. <!DOCTYPE html>
  2. <html lang="en" xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title th:text="${msg}"></title>
  6. </head>
  7. <body>
  8. <h1 th:text="'First Thymeleaf Test'"></h1>
  9. </body>
  10. </html>

Thymeleaf 基本语法

在html标签中引入命名空间：xmlns:th="http://www.thymeleaf.org"

标准表达式：

  • ${...} : 变量表达式。
  • *{...} : 选择表达式。
  • #{...} : 消息 (i18n) 表达式。
  • @{...} : 链接 (URL) 表达式。
  • ~{...} : 片段表达式。

表达式预处理：
关于表达式的最后一件事是知道表达式预处理，在__之间指定，如下所示：

  1. #{selection.__${sel.code}__}

上面代码中，第一个被执行的变量表达式是:${sel.code}，并且将使用它的结果作为表达式的一部分(假设${sel.code}的结果为:ALL)，在此处执行国际化的情况下(这将查找与关键selection.ALL消息)。

1、字符串变量输出：

  • th:text 在页面中输出值
  • th:utext 输出转义后的文本 ```html

注意事项：text和utext中存放的是字符串，所以需要用单引号 ‘’ 将字符串括起来 输出：

世界

世界

  2. 2、字符串操作<br />thymeleaf提供了一些内置对象，内置对象可以直接在模板中使用。这些对象是以 # 引用的。<br />使用内置对象的语法
  4. - 引用内置对象需要使用 # <br />
  5. - 大部分内置对象名称以 s 结尾，如strings、numbers、dates<br />
  6. ```html
  7. ${#strings.isEmpty(key)}：判断字符串是否为空，如果为空返回true，否则返回false
  8. ${#strings.contains(msg,'T')}：判断字符串是否包含指定的字串，如果包含返回true，否则返回false
  9. ${#strings.startWith(msg,'a')}：判断当前字符串是否以字串开头，是返回true，否返回false

3、日期格式化

  • ${#dates.format(key)}：格式化日期，默认以浏览器默认语言为格式化标准
  • ${#dates.format(key,’yyyy/MM/dd hh:mm:ss’)}：自定义格式化
  • ${#dates.year(key)}：取出年
  • ${#dates.month(key)}：取出月
  • ${#dates.year(day)}：取出日

4、条件判断

  • th:if：条件判断
  • th:switch/th:case：类似Java的switch语句，不一样的是，如果有多个匹配只显示第一个，th:case="*"表示Java中的default，即没有case的值为true时则显示th:case="*"的内容

5、循环遍历：th:each，循环迭代，th:each的状态变量

  • index：当前迭代器的索引，从0开始
  • count：当前迭代器的计数，从1开始
  • size：被迭代对象的长度
  • odd/even：布尔值，判断循环是否是偶数/奇数 从0开始
  • first：布尔值，当前循环的是否是第一条，是返回true
  • last：布尔值，当前循环的是否是最后一条，是返回true

th:each=”value,item : ${list}” ：value指代每条变量，而item指的是每条变量的属性。

6、操作域对象
Controller自动注入：

  1. @Autowired
  2. private HttpServletRequest request;
  • HttpServletRequest

Controller设值：request.setAttribute("req","HttpServletRequest)
页面中取值：

  • th:text="${#httpServletRequest.getAttribute('req')}"
  • th:text="${#request.getAttribute('req')}"
    • HttpSession

Controller设值：request.getSession().setAttribute("session","HttpSession)
页面中取值：

  • th:text="${#httpServletRequest.getSession().getAttribute('session')}"
  • th:text="${#request.getSession().getAttribute('session')}"
  • th:text="${#session.getAttribute('session')}"
  • th:text="${session.ses}"
    • ServletContext

Controller设值：request.getSession().getServletContext.setAttribute("ser","HttpServletContext)
页面中取值：

  • th:text="${#httpServletRequest.getSession().getServletContext.getAttribute('ser')}"
  • th:text="${#request.getSession().getServletContext.getAttribute('ser')}"
  • th:text="${#servletContext.getAttribute('app')}"
  • th:text="${application.app}"

7、url表达式：@{}

  1. 绝对路径：<a th:href="@{http://www.baidu.com}">绝对路径</a>
  2. 相对路径：
    • 相对于当前项目的根：<a th:href="@{/index}">相对路径</a>
    • 相对于服务器根目录：<a th:href="@{~/project1/index}">相对路径</a>

8、在url中传递参数：

  • 在普通格式的url中传递参数：
    • <a th:href="@{~/test(id=1,name='zhangsan')}">普通带参1</a>
    • <a th:href="@{~/test?id=2&name=zhangsan}">普通带参2</a>
    • <a th:href="@{'/test?id='+${id}+'&name='+${msg}}">普通带参3</a>
    • <a th:href="@{~/test(id=${id},name=${session.ses})}">普通带参4</a>
  • 在restful格式的url中传递参数：
    • <a th:href="@{~/hello/{id}/{name}(id=2,name='admin')}">Restful带参1</a>：http://localhost:8080/hello/2/admin
    • <a th:href="@{~/hello/{id}/{name}(id=${id},name=${msg})}">Restful带参2</a>：http://localhost:8080/hello/10/admin
    • <a th:href="@{~/hello/{id}(id=${id},name=${msg})}">Restful带参3</a>：http://localhost:8080/hello/10?name=admin

9、application中对thymeleaf常用配置：ThymeleafProperties.class

  1. spring:
  2.   thymeleaf:
  3.     prefix: classpath:/templates/  # 视图解析器前缀
  4.     suffix: .html  # 后缀
  5.     mode: HTML  # 配置视图模板类型，如果视图模板使用的是html5需要配置该项:HTML5
  6.     encoding: UTF-8 # 编码格式
  7.     servlet:
  8.       content-type: */* # 响应类型，默认*/*
  9.     cache: false # 配置页面缓存，开发设置为false
  10.     enabled: true