Thymeleaf 基本用法总结(12月1日更新)

Thymeleaf 基本用法总结

1. 引用命名空间

xmlns:th="http://www.thymeleaf.org">

在html中引入此命名空间，可避免编辑器出现html验证错误，虽然加不加命名空间对Thymeleaf的功能没有任何影
响。

2. 输出内容

说明：

• th:text 用来将内容输出到所在标签的body中。
• #{home.welcome} 用来引入数据home对象中的 welcome属性。
• 可以用th:utext 用来显示“unescaped ” 的html内容。

<p>Today is: 
<span th:text="${today}">13 February 2011</span>
</p>

说明：${today} 用来引用 today 变量

3. 访问对象

• ${param.x} 返回名为x 的 request参数。（可能有多个值）
• ${session.x} 返回名为x的Session参数。
• ${application.x} 返回名为 servlet context 的参数。

4. 基本语法

4.1. 访问数据

#｛home.welcome｝

4.2. 格式化数据

#{
     home.welcome(${
     session.user.name})}

当 home.welcome 为 “abcdegf{0}” 类似这种内容时。（多个参数以逗句分隔）

4.3. 访问变量

${
     today}

4.4. 访问基本对象

#ctx: the context object. 
#vars: the context variables. 
#locale: the context locale. 
#request: (only in Web Contexts) the HttpServletRequest object. 
#response: (only in Web Contexts) the HttpServletResponse object. 
#session: (only in Web Contexts) the HttpSession object. 
#servletContext: (only in Web Contexts) the ServletContext object. 

4.5. 日期的输出

{
     #calendars.format(today,'dd MMMM yyyy')}">13 May 2011 

4.6. 星号语法

{
     session.user}"> 
Name: {
     firstName}">Sebastian.
 
Surname: {
     lastName}">Pepper.
 
Nationality: {
     nationality}">Saturn.
 

4.7. 输出URL

{
     /product/list}">Product List {
     /order/{
     orderId}/details(orderId=${
     o.id})}">view

4.8. 使用代码段

{
     commons :: main}">...
 

4.9. 直接输出内容

 -- 输出字符 
 --输出数据表达式 
{
     user.isAdmin()} == false">  --输出布尔表达式 
{
     user.name} + '!'"> -- 带变量的

4.10. 条件表达式

{
     row.even}? 'even' : 'odd'"> ...
 
{
     row.even}? 'alt'">
 ...省略 false 结果的表达方式 
 
  
{
     session.user}"> 
  ...省略 true 结果的表达方式 
  
Age: {
     age}?: '(no age specified)'">27.
   
 
   {
     user.name} ?: _">no user authenticated --不做任何处理时用下划 线 _ 表示

4.11. 格式化

{
     {
     user.lastAccessDate}}">... --${
     {
     .}} 调用默认的格式化器来输出结果

4.12. 预处理

{
     __#{
     article.text('textVar')}__}">Some text here...

说明：thymeleaf 的处理模板内容的顺序与书写顺序无关，只能通过 ${expression} ，来将需要先一步计算出来后面要用的变量指定为优化处理。

5. 设置 Attribute 值

5.1. 设置任何Attribute 的方法

 
{
     subscribe.submit}"/> 
 
{
     /images/gtvglogo.png},title=# {
     logo},alt=#{
     logo}" />

5.2.设置一些内置的Attribute的方法

{
     /product/list}">Product List
 
{
     /subscribe}"> 
  {
     subscribe.submit}"/> 
  {
     /images/gtvglogo.png}" th:alt- 
  title="#{
     logo}" /> 
 

5.3. 设置html里没有指的任何属性的语法

 {
     user.name}">...

6. 循环输出的语法

6.1. 基本循环

{
     prods}"> 
{
     prod.name}">Onions 
{
     prod.price}">2.41
{
     prod.inStock}? #{
     true} : #{
     false}">yes 

6.2. 循环状态的使用

{
     prods}" th:class="${
     iterStat.odd}? 'odd'"> 
  
 
  

     
NAME
 
     
PRICE
 
     
IN STOCK
 
  
 
  
{
     prod.name}">Onions
 
{
     prod.price}">2.41
 
  
{
     prod.inStock}? #{
     true} : #{
     false}">yes
 
  
 

7. 条件判断

7.1. if 和 unless

{
     /comments(prodId=${
     prod.id})}" 
th:unless="${
     #lists.isEmpty(prod.comments)}">view 

{
     /product/comments(prodId=${
     prod.id})}" 
th:if="${
     not #lists.isEmpty(prod.comments)}">view

7.2. switch 语句

{
     user.role}"> 
  
User is an administrator
 
  
{
     roles.manager}">User is a manager
 
  
th:case="*">User is some other thing
 

8. 模板 include

8.1. 定义和引用代码块

 
~~~html 
th:fragment="copy"> ©; 2011 The Good Thymes Virtual Grocery 
 
~~~ 

引用代码块 
~~~html 
{
     footer :: copy}">
 
~~~

 ~~~html 
"copy-section"> ©; 
2011 The Good Thymes Virtual Grocery 
 ~~~ 

~~~html 
{
     footer :: #copy-section}">

 ~~~

8.2. th:insert th:replace th:include 之间的区别

• th:insert — 插入代码块
• th:replace – 替换代码块会替换掉容器标签
• th:include ----和insert相似但只会插入fragment标注body内的内容

8.3 带参数的代码段

 
{
     onevar} + ' - ' + ${
     twovar}">...
 

{
     value1},${
     value2})">...
 
{
     value1},twovar=${
     value2})">...

9. 局部变量的使用示例

{
     persons[0]}">
 
 
    The name is {
     firstPer.name}">Julius Caesar. 
 
 
 
 

{
     persons[0]},secondPer=${
     persons[1]}"> 
 
 
   The name is {
     firstPer.name}">Julius Caesar. 
 
 
 But the name of the second person is {
     secondPer.name}">Marcus Antonius. 
 

10. 注释

11. 复选框回显

12. 获取应用项目路径

ctxPath = [[@{
     /}]];