Thymeleaf 5 分钟教程

简介: Thymeleaf 是一个用于 web 和独立环境的现代服务器端 Java 模板引擎。Thymeleaf 的主要目标是为开发工作流程带来优雅的自然模板ー HTML,它既可以在浏览器中正确显示,也可以作为静态原型工作,从而加强开发团队之间的协作。有了 Spring Framework 的模块、大量与您最喜欢的工具集成的功能,以及插入您自己功能的能力,Thymeleaf 是现代 HTML5 JVM web 开发的理想选择ーー尽管它可以做的还有很多。用 Thymeleaf 语言编写的 HTML 模板看起来和工作方式仍然类似于 HTML,使得在应用程序中运行的实际模板仍然可以作为有用的设计工件工

Thymeleaf 是一个用于 web 和独立环境的现代服务器端 Java 模板引擎。


Thymeleaf 的主要目标是为开发工作流程带来优雅的自然模板ー HTML,它既可以在浏览器中正确显示,也可以作为静态原型工作,从而加强开发团队之间的协作。


有了 Spring Framework 的模块、大量与您最喜欢的工具集成的功能,以及插入您自己功能的能力,Thymeleaf 是现代 HTML5 JVM web 开发的理想选择ーー尽管它可以做的还有很多。


用 Thymeleaf 语言编写的 HTML 模板看起来和工作方式仍然类似于 HTML,使得在应用程序中运行的实际模板仍然可以作为有用的设计工件工作。

<table>
  <thead>
    <tr>
      <th th:text="#{msgs.headers.name}">Name</th>
      <th th:text="#{msgs.headers.price}">Price</th>
    </tr>
  </thead>
  <tbody>
    <tr th:each="prod: ${allProducts}">
      <td th:text="${prod.name}">Oranges</td>
      <td th:text="${#numbers.formatDecimal(prod.price, 1, 2)}">0.99</td>
    </tr>
  </tbody>
</table>


Thymeleaf 3.0.11.RELEASE is the current stable version. It requires Java SE 6 or newer.


  • Release date: 29 October 2018




For the old 2.1.x branch, Thymeleaf 2.1.6.RELEASE is the latest version.


标准方言


称为 Standard 和 SpringStandard ,这些方言定义了一组特性,对于大多数场景来说,这些特性应该足够了。 你可以识别这些标准方言何时在模板中使用,因为它包含以 th 前缀开头的属性,比如 span th: text..."。

${...} : Variable expressions.
*{...} : Selection expressions.
#{...} : Message (i18n) expressions.
@{...} : Link (URL) expressions.
~{...} : Fragment expressions.


Variable expressions.

<span th:text="${book.author.name}">


Variable expressions

<div th:object="${book}">
  ...
  <span th:text="*{title}">...</span>
  ...
</div>


所以这相当于:

{
  // th:object="${book}"
  final Book selection = (Book) context.getVariable("book");
  // th:text="*{title}"
  output(selection.getTitle());
}


消息表达式(通常称为文本外部化、国际化或 i18n)允许我们从外部源(。 属性文件) ,通过键引用它们,并(可选地)应用一组参数。

<table>
  ...
  <th th:text="#{header.address.city}">...</th>
  <th th:text="#{header.address.country}">...</th>
  ...
</table>


  1. 链接表达式



意味着构建 URL 并向其添加有用的上下文和会话信息(一个通常称为 URL 重写的过程)。

因此,对于部署在 web 服务器的 / myapp 上下文中的 web 应用程序,可以使用如下表达式:

<a th:href="@{../documents/report}">...</a>


可以转换成这样的东西:


<a href="/myapp/order/list">...</a>


Url 也可以带参数:

<a th:href="@{/order/details(id=${orderId},type=${orderType})}">...</a>


导致这样的结果:

<!-- Note ampersands (&) should be HTML-escaped in tag attributes... -->
<a href="/myapp/order/details?id=23&amp;type=online">...</a>


链接表达式可以是相对的,在这种情况下,没有应用程序上下文将前缀的 URL:

<a th:href="@{../documents/report}">...</a>


还有服务器相关(同样,没有应用程序上下文可以前缀) :

<a th:href="@{~/contents/main}">...</a>


和 protocol-relative (就像绝对 url 一样,但是浏览器将使用与显示页面相同的 HTTP 或 HTTPS 协议) :

<a th:href="@{//static.mycompany.com/res/initial}">...</a>


当然,Link 表达式可以是绝对的:

<a th:href="@{http://www.mycompany.com/main}">...</a>


  1. 片段表达式


是表示标记片段并在模板中移动它们的简单方法。 由于这些表达式,片段可以被复制,作为参数传递给其他模板,等等。

<div th:insert="~{commons :: main}">...</div>


但是它们可以在任何地方使用,就像任何其他变量一样:

<div th:with="frag=~{footer :: #main/text()}">
  <p th:insert="${frag}">
</div>


文字和操作


A good bunch of types of literals and operations are available:


Literals:


Text literals: 'one text', 'Another one!',…


Number literals: 0, 34, 3.0, 12.3,…


Boolean literals: true, false


Null literal: null


Literal tokens: one, sometext, main,…


Text operations: 文本运算


String concatenation: +


Literal substitutions: |The name is ${name}|


Arithmetic operations:


Binary operators: +, -, *, /, %


Minus sign (unary operator): -


Boolean operations: 布尔运算


Binary operators: and, or


Boolean negation (unary operator): !, not


Comparisons and equality: 比较运算


Comparators: >, <, >=, <= (gt, lt, ge, le)


Equality operators: ==, != (eq, ne)


Conditional operators: 条件运算


If-then: (if) ? (then)


If-then-else: (if) ? (then) : (else)


Default: (value) ?: (defaultvalue)


一些基本属性



让我们来看看文学语言中的一些最基本的属性。 以 th: text 开始,它只是替换了标记的主体(请再次注意这里的原型化能力) :

<p th:text="#{msg.welcome}">Welcome everyone!</p>


接下来是 each,它会重复数组或表达式返回的元素的次数,并为迭代元素创建一个内部变量,其语法与 Java foreach 表达式相同:

<li th:each="book : ${books}" th:text="${book.title}">En las Orillas del Sar</li>


最后,Thymeleaf 为特定的 XHTML 和 HTML5属性包含了许多 th 属性,这些属性只是评估它们的表达式并将这些属性的值设置为它们的结果。 他们的名字模仿了他们设置的属性值:

<form th:action="@{/createOrder}">
<input type="button" th:value="#{form.submit}" />
<a th:href="@{/admin/users}">


thymeleaf th:if表达式语法


网页应用

<td class="td-status" th:if="${product.status} eq 1">
    <span class="label label-success radius">已上架</span>
</td>

<a th:if="${product.status} ne 2 " class="ml-5"  href="javascript:;" title="发布秒杀">
    <i class="Hui-iconfont">&#xe603;</i>
</a>


参考


thymeleaf th:if表达式语法


https://blog.csdn.net/weixin_38970805/article/details/82937465




目录
相关文章
|
前端开发 Java
SpringBoot-6-模板Thymeleaf常用标签
SpringBoot-6-模板Thymeleaf常用标签
89 0
SpringBoot-6-模板Thymeleaf常用标签
|
7月前
|
XML 前端开发 Java
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
148 0
|
7月前
|
JavaScript Java Maven
Thymeleaf实践总结
Thymeleaf实践总结
102 0
|
7月前
|
移动开发 Java HTML5
Thymeleaf - 与SpringBoot整合入门
Thymeleaf - 与SpringBoot整合入门
89 0
|
前端开发 Java Spring
Thymeleaf使用笔记
Thymeleaf使用笔记
46 0
|
存储 JavaScript 前端开发
Thymeleaf入门教程
Thymeleaf入门教程
169 0
|
Java 程序员 Maven
模板引擎:第二章:Thymeleaf
模板引擎:第二章:Thymeleaf
160 0
模板引擎:第二章:Thymeleaf
|
XML Java 程序员
模板引擎:第一章:FreeMarker
模板引擎:第一章:FreeMarker
199 0
模板引擎:第一章:FreeMarker
|
前端开发 Java 应用服务中间件
Thymeleaf
模板引擎 前端交给我们的页面,是html页面。如果是我们以前开发,我们需要把他们转成jsp页面,jsp好处就是当我们查出一些数据转发到JSP页面以后,我们可以用jsp轻松实现数据的显示,及交互等。
Thymeleaf
|
设计模式 前端开发 Java
【JavaWeb】模板引擎Thymeleaf
内容提取出来单独的放在一个文件中,称为模板,对于一些动态的内容,可以将这些内容在模板中使用占位符占位,当服务器把这些动态的内容计算好了之后,就可以把模板中占位符替换成动态计算的结果,然后把组装好的HTML格式的字符串在返回给浏览器
【JavaWeb】模板引擎Thymeleaf