Thymeleaf 教程：使用Thymeleaf[官方]

Thymeleaf 教程：使用Thymeleaf[官方]

 

目录

 

1介绍Thymeleaf

2 The Good Thymes虚拟杂货店

3使用文本

4标准表达式语法

5设置属性值

6迭代

7条件评估

8模板布局

9局部变量

10属性优先级

11评论和块

12内联

13文本模板模式

14我们杂货店的更多页面

15有关配置的更多信息

16模板缓存

17解耦模板逻辑

18附录A：表达式基本对象

19附录B：表达式实用程序对象

20附录C：标记选择器语法

多值类匹配

---

1介绍Thymeleaf

1.1什么是Thymeleaf？

Thymeleaf是一个适用于Web和独立环境的现代服务器端Java模板引擎，能够处理HTML，XML，JavaScript，CSS甚至纯文本。

Thymeleaf的主要目标是提供一种优雅且高度可维护的模板创建方式。为实现这一目标，它以自然模板的概念为基础，将其逻辑注入模板文件，其方式不会影响模板被用作设计原型。这改善了设计沟通，缩小了设计和开发团队之间的差距。

Thymeleaf也从一开始就设计了Web标准 - 特别是HTML5 - 允许您创建完全验证的模板，如果这是您的需要。

1.2 Thymeleaf过程可以使用哪种模板？

开箱即用，Thymeleaf允许您处理六种模板，每种模板称为模板模式：

• HTML
• XML
• 文本
• JAVASCRIPT
• CSS
• 生的

有两种标记模板模式（HTML和XML），三种文本模板模式（TEXT，JAVASCRIPT和CSS）和一种无操作模板模式（RAW）。

该HTML模板模式将允许任何类型的HTML的输入，包括HTML5，HTML4和XHTML。不会执行验证或格式良好检查，并且将在输出中尽可能地尊重模板代码/结构。

该XML模板模式将允许XML输入。在这种情况下，代码应该是格式良好的 - 没有未封闭的标签，没有不带引号的属性等 - 如果发现格式错误，解析器将抛出异常。请注意，不会执行任何验证（针对DTD或XML架构）。

该TEXT模板模式将允许非标记性质的模板使用特殊的语法。此类模板的示例可能是文本电子邮件或模板文档。请注意，HTML或XML模板也可以被处理TEXT，在这种情况下，它们不会被解析为标记，并且每个标记，DOCTYPE，注释等都将被视为纯文本。

该JAVASCRIPT模板模式将允许在Thymeleaf应用程序的JavaScript文件的处理。这意味着能够以与HTML文件相同的方式在JavaScript文件中使用模型数据，但是使用特定于JavaScript的集成，例如专门的转义或自然脚本。该JAVASCRIPT模板模式被认为是一种文本模式，因此使用相同的特殊语法的TEXT模板模式。

该CSS模板模式将允许参与Thymeleaf应用CSS文件的处理。与JAVASCRIPT模式类似，CSS模板模式也是文本模式，并使用TEXT模板模式中的特殊处理语法。

该RAW模板模式将根本不处理模板。它用于将未经处理的资源（文件，URL响应等）插入到正在处理的模板中。例如，HTML格式的外部非受控资源可以包含在应用程序模板中，安全地知道这些资源可能包含的任何Thymeleaf代码都不会被执行。

1.3方言：标准方言

Thymeleaf是一个极易扩展的模板引擎（实际上它可以称为模板引擎框架），允许您定义和自定义模板处理的细节级别。

将一些逻辑应用于标记工件（标签，某些文本，注释或仅仅是占位符，如果模板不是标记）的对象称为处理器，这些处理器的集合 - 加上可能还有一些额外的工件 - 是什么一个方言通常是由。开箱即用，Thymeleaf的核心库提供了一种称为标准方言的方言，对大多数用户来说应该足够了。

请注意，方言实际上可以没有处理器，并且完全由其他类型的工件组成，但处理器绝对是最常见的用例。

本教程涵盖标准方言。您将在以下页面中了解的每个属性和语法功能都由此方言定义，即使没有明确提及。

当然，如果用户希望在利用库的高级功能的同时定义自己的处理逻辑，则可以创建自己的方言（甚至扩展标准方言）。Thymeleaf也可以配置为一次使用多种方言。

官方的thymeleaf-spring3和thymeleaf-spring4集成包都定义了一种称为“SpringStandard Dialect”的方言，它与标准方言大致相同，但是为了更好地利用Spring Framework中的某些功能（例如） ，使用Spring Expression Language或SpringEL代替OGNL）。因此，如果您是Spring MVC用户，那么您不会浪费时间，因为您在此处学习的几乎所有内容都将在Spring应用程序中使用。

标准方言的大多数处理器都是属性处理器。这使得浏览器甚至可以在处理之前正确显示HTML模板文件，因为它们只会忽略其他属性。例如，虽然使用标记库的JSP可能包含不能由浏览器直接显示的代码片段，例如：

<form:inputText name="userName" value="${user.name}" />

...... Thymeleaf标准方言将允许我们实现相同的功能：

<input type="text" name="userName" value="James Carrot" th:value="${user.name}" />

这不仅可以被浏览器正确显示，而且还允许我们（可选地）在其中指定一个值属性（在这种情况下为“James Carrot”），当在浏览器中静态打开原型时将显示该属性，并且这将由${user.name}在处理模板期间评估得到的值代替。

这有助于您的设计人员和开发人员处理相同的模板文件，并减少将静态原型转换为工作模板文件所需的工作量。执行此操作的能力是称为自然模板的功能。

2 The Good Thymes虚拟杂货店

可以在Good Thymes Virtual Grocery GitHub存储库中找到本指南的本章和后续章节中显示的示例的源代码。

2.1杂货店的网站

为了更好地解释使用Thymeleaf处理模板所涉及的概念，本教程将使用可从项目网站下载的演示应用程序。

这个应用程序是一个假想的虚拟杂货的网站，并将为我们提供许多场景来展示Thymeleaf的许多功能。

首先，我们需要一套简单的模型实体用于我们的应用程序：通过创建Products销售。我们还将管理这些：CustomersOrdersCommentsProducts

转存失败重新上传取消

示例应用程序模型

我们的应用程序还有一个非常简单的服务层，由Service包含以下方法的对象组成：

public class ProductService {

    ...

    public List findAll() {
        return ProductRepository.getInstance().findAll();
    }

    public Product findById(Integer id) {
        return ProductRepository.getInstance().findById(id);
    }
    
}

在Web层，我们的应用程序将有一个过滤器，它将根据请求URL将执行委托给启用Thymeleaf的命令：

private boolean process(HttpServletRequest request, HttpServletResponse response)
        throws ServletException {
    
    try {

        // This prevents triggering engine executions for resource URLs
        if (request.getRequestURI().startsWith("/css") ||
                request.getRequestURI().startsWith("/images") ||
                request.getRequestURI().startsWith("/favicon")) {
            return false;
        }

        
        /*
         * Query controller/URL mapping and obtain the controller
         * that will process the request. If no controller is available,
         * return false and let other filters/servlets process the request.
         */
        IGTVGController controller = this.application.resolveControllerForRequest(request);
        if (controller == null) {
            return false;
        }

        /*
         * Obtain the TemplateEngine instance.
         */
        ITemplateEngine templateEngine = this.application.getTemplateEngine();

        /*
         * Write the response headers
         */
        response.setContentType("text/html;charset=UTF-8");
        response.setHeader("Pragma", "no-cache");
        response.setHeader("Cache-Control", "no-cache");
        response.setDateHeader("Expires", 0);

        /*
         * Execute the controller and process view template,
         * writing the results to the response writer. 
         */
        controller.process(
                request, response, this.servletContext, templateEngine);
        
        return true;
        
    } catch (Exception e) {
        try {
            response.sendError(HttpServletResponse.SC_INTERNAL_SERVER_ERROR);
        } catch (final IOException ignored) {
            // Just ignore this
        }
        throw new ServletException(e);
    }
    
}

这是我们的IGTVGController界面：

public interface IGTVGController {

    public void process(
            HttpServletRequest request, HttpServletResponse response,
            ServletContext servletContext, ITemplateEngine templateEngine);    
    
}

我们现在要做的就是创建IGTVGController接口的实现，从服务中检索数据并使用ITemplateEngine对象处理模板。

最后，它看起来像这样：

转存失败重新上传取消

示例应用程序主页

但首先让我们看看该模板引擎是如何初始化的。

2.2创建和配置模板引擎

我们的过滤器中的process（...）方法包含以下行：

ITemplateEngine templateEngine = this.application.getTemplateEngine();

这意味着GTVGApplication类负责创建和配置Thymeleaf应用程序中最重要的对象之一：TemplateEngine实例（ITemplateEngine接口的实现）。

我们的org.thymeleaf.TemplateEngine对象初始化如下：

public class GTVGApplication {
  
    
    ...
    private final TemplateEngine templateEngine;
    ...
    
    
    public GTVGApplication(final ServletContext servletContext) {

        super();

        ServletContextTemplateResolver templateResolver = 
                new ServletContextTemplateResolver(servletContext);
        
        // HTML is the default mode, but we set it anyway for better understanding of code
        templateResolver.setTemplateMode(TemplateMode.HTML);
        // This will convert "home" to "/WEB-INF/templates/home.html"
        templateResolver.setPrefix("/WEB-INF/templates/");
        templateResolver.setSuffix(".html");
        // Template cache TTL=1h. If not set, entries would be cached until expelled
        templateResolver.setCacheTTLMs(Long.valueOf(3600000L));
        
        // Cache is set to true by default. Set to false if you want templates to
        // be automatically updated when modified.
        templateResolver.setCacheable(true);
        
        this.templateEngine = new TemplateEngine();
        this.templateEngine.setTemplateResolver(templateResolver);
        
        ...

    }

}

配置TemplateEngine对象有很多种方法，但是现在这几行代码将足以告诉我们所需的步骤。

模板解析器

让我们从模板解析器开始：

ServletContextTemplateResolver templateResolver = 
        new ServletContextTemplateResolver(servletContext);

模板解析器是实现Thymeleaf API接口的对象，称为org.thymeleaf.templateresolver.ITemplateResolver：

public interface ITemplateResolver {

    ...
  
    /*
     * Templates are resolved by their name (or content) and also (optionally) their 
     * owner template in case we are trying to resolve a fragment for another template.
     * Will return null if template cannot be handled by this template resolver.
     */
    public TemplateResolution resolveTemplate(
            final IEngineConfiguration configuration,
            final String ownerTemplate, final String template,
            final Map, Object> templateResolutionAttributes);
}

这些对象负责确定我们的模板的访问方式，在这个GTVG应用程序中，org.thymeleaf.templateresolver.ServletContextTemplateResolver我们将从Servlet上下文中检索模板文件作为资源的方式：javax.servlet.ServletContext每个Java Web应用程序中都存在的应用程序范围的对象，并从Web应用程序根解析资源。

但这并不是我们可以说的关于模板解析器的全部内容，因为我们可以在其上设置一些配置参数。一，模板模式：

templateResolver.setTemplateMode(TemplateMode.HTML);

HTML是默认的模板模式ServletContextTemplateResolver，但最好还是建立它，以便我们的代码清楚地记录正在发生的事情。

templateResolver.setPrefix("/WEB-INF/templates/");
templateResolver.setSuffix(".html");

该前缀和后缀修改，我们将传递到发动机获得要使用的真实资源名称的模板名称。

使用此配置，模板名称“product / list”将对应于：

servletContext.getResourceAsStream("/WEB-INF/templates/product/list.html")

（可选）通过cacheTTLMs属性在模板解析器中配置解析模板可以在缓存中存在的时间量：

templateResolver.setCacheTTLMs(3600000L);

如果达到最大高速缓存大小并且它是当前高速缓存的最旧条目，则在达到该TTL之前，模板仍然可以从高速缓存中排出。

用户可以通过实现ICacheManager接口或修改StandardCacheManager对象来管理默认缓存来定义缓存行为和大小。

关于模板解析器还有很多东西需要学习，但是现在我们来看看Template Engine对象的创建。

模板引擎

Template Engine对象是org.thymeleaf.ITemplateEngine接口的实现。其中一个实现是由Thymeleaf核心提供的：org.thymeleaf.TemplateEngine我们在这里创建一个实例：

templateEngine = new TemplateEngine();
templateEngine.setTemplateResolver(templateResolver);

相当简单，不是吗？我们所需要的只是创建一个实例并将模板解析器设置为它。

模板解析器是唯一需要的参数TemplateEngine，尽管稍后将介绍许多其他参数（消息解析器，缓存大小等）。现在，这就是我们所需要的。

我们的模板引擎现已准备就绪，我们可以使用Thymeleaf开始创建我们的页面。

3使用文本

3.1多语言欢迎

我们的第一个任务是为我们的杂货网站创建一个主页。

这个页面的第一个版本非常简单：只是标题和欢迎信息。这是我们的/WEB-INF/templates/home.html文件：

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

  <head>
    <title>Good Thymes Virtual Grocerytitle>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" media="all" 
          href="../../css/gtvg.css" th:href="@{/css/gtvg.css}" />
  head>

  <body>
  
    <p th:text="#{home.welcome}">Welcome to our grocery store!p>
  
  body>

html>

您将注意到的第一件事是该文件是HTML5，任何浏览器都可以正确显示它，因为它不包含任何非HTML标记（浏览器会忽略它们不理解的所有属性，例如th:text）。

但是您可能还注意到此模板实际上不是有效的 HTML5文档，因为th:*HTML5规范不允许我们在表单中使用这些非标准属性。事实上，我们甚至xmlns:th在我们的标签中添加了一个属性，绝对不是HTML5-ish：

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

...它在模板处理中根本没有任何影响，但是作为一个咒语，阻止我们的IDE抱怨缺少所有这些th:*属性的命名空间定义。

那么如果我们想让这个模板HTML5有效呢？简单：切换到Thymeleaf的数据属性语法，使用data-属性名称和hyphen（-）分隔符的前缀而不是分号（:）：

<html>

  <head>
    <title>Good Thymes Virtual Grocerytitle>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" media="all" 
          href="../../css/gtvg.css" data-th-href="@{/css/gtvg.css}" />
  head>

  <body>
  
    <p data-th-text="#{home.welcome}">Welcome to our grocery store!p>
  
  body>

html>

data-HTML5规范允许使用自定义前缀属性，因此，使用上面的代码，我们的模板将是有效的HTML5文档。

两种表示法都是完全等效且可互换的，但为了代码示例的简单性和紧凑性，本教程将使用名称空间表示法（th:*）。此外，th:*符号更通用，并且在每个Thymeleaf模板模式（XML，TEXT...）中data-都允许使用，而符号仅允许在HTML模式中使用。

使用th：文本和外化文本

外化文本是从模板文件中提取模板代码的片段，以便它们可以保存在单独的文件（通常是.properties文件）中，并且可以使用其他语言编写的等效文本（称为国际化或简称i18n）轻松替换它们。外化的文本片段通常称为“消息”。

消息始终具有标识它们的键，而Thymeleaf允许您指定文本应与具有以下#{...}语法的特定消息对应：

<p th:text="#{home.welcome}">Welcome to our grocery store!p>

我们在这里看到的实际上是Thymeleaf标准方言的两个不同特征：

• 该th:text属性评估其值表达式并将结果设置为主机标签的主体，有效地替换了我们在代码中看到的“欢迎使用我们的杂货店！”文本。
• 的#{home.welcome}表达，在指定的标准表达式语法，指示要由所使用的文本th:text属性应与该消息home.welcome对应于哪个语言环境，我们正在处理与模板键。

现在，这个外化文本在哪里？

Thymeleaf中外化文本的位置是完全可配置的，它取决于org.thymeleaf.messageresolver.IMessageResolver所使用的具体实现。通常，.properties将使用基于文件的实现，但是如果我们想要，例如，从数据库获取消息，我们可以创建自己的实现。

但是，我们在初始化期间没有为模板引擎指定消息解析器，这意味着我们的应用程序正在使用标准消息解析器，由org.thymeleaf.messageresolver.StandardMessageResolver。实现。

标准消息解析程序期望/WEB-INF/templates/home.html在同一文件夹中找到属性文件中的消息，并使用与模板相同的名称，例如：

• /WEB-INF/templates/home_en.properties 用于英文文本。
• /WEB-INF/templates/home_es.properties 西班牙语文本。
• /WEB-INF/templates/home_pt_BR.properties 用于葡萄牙语（巴西）语言文本。
• /WEB-INF/templates/home.properties 对于默认文本（如果区域设置不匹配）。

我们来看看我们的home_es.properties文件：

home.welcome=¡Bienvenido a nuestra tienda de comestibles!

这就是我们将Thymeleaf流程作为模板所需的全部内容。让我们创建我们的Home控制器。

上下文

为了处理我们的模板，我们将创建一个HomeController实现IGTVGController我们之前看到的接口的类：

public class HomeController implements IGTVGController {

    public void process(
            final HttpServletRequest request, final HttpServletResponse response,
            final ServletContext servletContext, final ITemplateEngine templateEngine)
            throws Exception {
        
        WebContext ctx = 
                new WebContext(request, response, servletContext, request.getLocale());
        
        templateEngine.process("home", ctx, response.getWriter());
        
    }

}

我们看到的第一件事是创建一个上下文。Thymeleaf上下文是实现org.thymeleaf.context.IContext接口的对象。上下文应包含在变量映射中执行模板引擎所需的所有数据，并且还引用必须用于外部化消息的语言环境。

public interface IContext {

    public Locale getLocale();
    public boolean containsVariable(final String name);
    public Set getVariableNames();
    public Object getVariable(final String name);
    
}

这个接口有一个专门的扩展，org.thymeleaf.context.IWebContext用于基于ServletAPI的Web应用程序（如SpringMVC）。

public interface IWebContext extends IContext {
    
    public HttpServletRequest getRequest();
    public HttpServletResponse getResponse();
    public HttpSession getSession();
    public ServletContext getServletContext();
    
}

Thymeleaf核心库提供了以下每个接口的实现：

• org.thymeleaf.context.Context 器物 IContext
• org.thymeleaf.context.WebContext 器物 IWebContext

正如您在控制器代码中看到的那样，WebContext是我们使用的那个。实际上我们必须这样做，因为使用a ServletContextTemplateResolver要求我们使用上下文实现IWebContext。

WebContext ctx = new WebContext(request, response, servletContext, request.getLocale());

这四个构造函数参数中只有三个是必需的，因为如果没有指定系统，将使用系统的默认语言环境（尽管在实际应用程序中不应该发生这种情况）。

我们可以使用一些专门的表达式来从WebContext模板中获取请求参数以及请求，会话和应用程序属性。例如：

• ${x}将返回x存储在Thymeleaf上下文中的变量或作为请求属性。
• ${param.x}将返回一个被调用的请求参数x（可能是多值的）。
• ${session.x}将返回一个名为的会话属性x。
• ${application.x}将返回一个名为的servlet上下文属性x。

执行模板引擎

准备好上下文对象后，现在我们可以告诉模板引擎使用上下文处理模板（通过其名称），并将响应编写器传递给它，以便可以将响应写入它：

templateEngine.process("home", ctx, response.getWriter());

让我们使用西班牙语语言环境查看结果：

<html>

  <head>
    <title>Good Thymes Virtual Grocerytitle>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
    <link rel="stylesheet" type="text/css" media="all" href="/gtvg/css/gtvg.css" />
  head>

  <body>
  
    <p>¡Bienvenido a nuestra tienda de comestibles!p>

  body>

html>

3.2有

3.2有关文本和变量的更多信息

未转义的文字

我们主页的最简单版本现在似乎已经准备就绪，但有一些我们没有想过的......如果我们有这样的消息怎么办？

home.welcome=Welcome to our fantastic grocery store!

如果我们像以前一样执行此模板，我们将获得：

<p>Welcome to our <b>fantastic</b> grocery store!p>

这不完全符合我们的预期，因为我们的标签已被转义，因此它将在浏览器中显示。

这是th:text属性的默认行为。如果我们希望Thymeleaf尊重我们的HTML标签而不是逃避它们，我们将不得不使用不同的属性:( th:utext对于“非转义文本”）：

<p th:utext="#{home.welcome}">Welcome to our grocery store!p>

这将输出我们的消息，就像我们想要的那样：

<p>Welcome to our <b>fantasticb> grocery store!p>

使用和显示变量

现在让我们在主页上添加更多内容。例如，我们可能希望在欢迎消息下方显示日期，如下所示：

Welcome to our fantastic grocery store!

Today is: 12 july 2010

首先，我们必须修改控制器，以便将该日期添加为上下文变量：

public void process(
            final HttpServletRequest request, final HttpServletResponse response,
            final ServletContext servletContext, final ITemplateEngine templateEngine)
            throws Exception {
        
    SimpleDateFormat dateFormat = new SimpleDateFormat("dd MMMM yyyy");
    Calendar cal = Calendar.getInstance();
        
    WebContext ctx = 
            new WebContext(request, response, servletContext, request.getLocale());
    ctx.setVariable("today", dateFormat.format(cal.getTime()));
        
    templateEngine.process("home", ctx, response.getWriter());
        
}

我们添加了一个String调用today我们上下文的变量，现在我们可以在模板中显示它：

<body>

  <p th:utext="#{home.welcome}">Welcome to our grocery store!p>

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

正如您所看到的，我们仍在使用th:text作业的属性（这是正确的，因为我们想要替换标签的主体），但这次语法有点不同而不是#{...}表达式值，我们使用的是${...}一。这是一个变量表达式，它包含一个名为OGNL（对象图导航语言）的语言表达式，该表达式将在我们之前讨论过的上下文变量映射上执行。

该${today}表达式只是表示“今天拿到称为变量”，但这些表述可能更加复杂（如${user.name}“获取被叫用户的变量，并调用它的getName()方法”）。

属性值有很多可能性：消息，变量表达式......还有很多。下一章将向我们展示所有这些可能性。

4标准表达式语法

我们将在杂货虚拟商店的开发中稍作休息，以了解Thymeleaf标准方言中最重要的部分之一：Thymeleaf标准表达式语法。

我们已经看到在这种语法中表达的两种类型的有效属性值：消息和变量表达式：

<p th:utext="#{home.welcome}">Welcome to our grocery store!p>

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

但是有更多类型的表达式，以及更多有趣的细节来了解我们已经知道的。首先，让我们看一下标准表达式功能的快速摘要：

• 简单表达：
  • 变量表达式： ${...}
  • 选择变量表达式： *{...}
  • 消息表达式： #{...}
  • 链接网址表达式： @{...}
  • 片段表达式： ~{...}
• 字面
  • 文本文字：'one text'，'Another one!'，...
  • 号码文字：0，34，3.0，12.3，...
  • 布尔文字：true，false
  • 空字面： null
  • 文字标记：one，sometext，main，...
• 文字操作：
  • 字符串连接： +
  • 文字替换： |The name is ${name}|
• 算术运算：
  • 二元运算符：+，-，*，/，%
  • 减号（一元运算符）： -
• 布尔运算：
  • 二元运算符：and，or
  • 布尔否定（一元运算符）： !，not
• 比较和平等：
  • 比较：>，<，>=，<=（gt，lt，ge，le）
  • 平等运营商：==，!=（eq，ne）
• 有条件的运营商：
  • IF-THEN： (if) ? (then)
  • IF-THEN-ELSE： (if) ? (then) : (else)
  • 默认： (value) ?: (defaultvalue)
• 特殊代币：
  • 无操作： _

所有这些功能都可以组合和嵌套：

'User is of type ' + (${user.isAdmin()} ? 'Administrator' : (${user.type} ?: 'Unknown'))

4.1消息

我们已经知道，#{...}消息表达式允许我们链接：

<p th:utext="#{home.welcome}">Welcome to our grocery store!p>

......对此：

home.welcome=¡Bienvenido a nuestra tienda de comestibles!

但是有一个方面我们还没有想到：如果消息文本不是完全静态会发生什么？例如，如果我们的应用程序知道谁是随时访问该网站的用户并且我们想通过名字问候他们怎么办？

<p>¡Bienvenido a nuestra tienda de comestibles, John Apricot!p>

这意味着我们需要在消息中添加一个参数。像这样：

home.welcome=¡Bienvenido a nuestra tienda de comestibles, {0}!

参数根据java.text.MessageFormat标准语法指定，这意味着您可以格式化为java.text.*包的类API文档中指定的数字和日期。

为了为我们的参数指定一个值，并给定一个被调用的HTTP会话属性user，我们可以：

<p th:utext="#{home.welcome(${session.user.name})}">
  Welcome to our grocery store, Sebastian Pepper!
p>

请注意，使用th:utext此处意味着格式化的消息不会被转义。此示例假定user.name已经转义。

可以指定几个参数，以逗号分隔。

消息密钥本身可以来自变量：

<p th:utext="#{${welcomeMsgKey}(${session.user.name})}">
  Welcome to our grocery store, Sebastian Pepper!
p>

4.2变量

我们已经提到${...}表达式实际上是在上下文中包含的变量映射上执行的OGNL（对象 - 图形导航语言）表达式。

有关OGNL语法和功能的详细信息，请阅读OGNL语言指南

在Spring支持MVC的应用程序中，OGNL将被SpringEL取代，但其语法与OGNL的语法非常相似（实际上，对于大多数常见情况来说，完全相同）。

从OGNL的语法，我们知道表达式：

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

......实际上相当于：

ctx.getVariable("today");

但是OGNL允许我们创建更强大的表达式，这就是：

<p th:utext="#{home.welcome(${session.user.name})}">
  Welcome to our grocery store, Sebastian Pepper!
p>

...通过执行以下命令获取用户名：

((User) ctx.getVariable("session").get("user")).getName();

但是getter方法导航只是OGNL的功能之一。让我们看看更多：

/*
 * Access to properties using the point (.). Equivalent to calling property getters.
 */
${person.father.name}

/*
 * Access to properties can also be made by using brackets ([]) and writing 
 * the name of the property as a variable or between single quotes.
 */
${person['father']['name']}

/*
 * If the object is a map, both dot and bracket syntax will be equivalent to 
 * executing a call on its get(...) method.
 */
${countriesByCode.ES}
${personsByName['Stephen Zucchini'].age}

/*
 * Indexed access to arrays or collections is also performed with brackets, 
 * writing the index without quotes.
 */
${personsArray[0].name}

/*
 * Methods can be called, even with arguments.
 */
${person.createCompleteName()}
${person.createCompleteNameWithSeparator('-')}

表达式基本对象

在上下文变量上评估OGNL表达式时，某些对象可用于表达式以获得更高的灵活性。将从#符号开始引用这些对象（根据OGNL标准）：

• #ctx：上下文对象。
• #vars: 上下文变量。
• #locale：上下文区域设置。
• #request:(仅限Web Contexts）HttpServletRequest对象。
• #response:(仅限Web Contexts）HttpServletResponse对象。
• #session:(仅限Web Contexts）HttpSession对象。
• #servletContext:(仅限Web Contexts）ServletContext对象。

所以我们可以这样做：

Established locale country: <span th:text="${#locale.country}">USspan>.

您可以在附录A中阅读这些对象的完整参考。

Expression Utility对象

除了这些基本对象，Thymeleaf还将为我们提供一组实用程序对象，帮助我们在表达式中执行常见任务。

• #execInfo：有关正在处理的模板的信息。
• #messages：在变量表达式中获取外化消息的方法，与使用＃{...}语法获取的方法相同。
• #uris：转义部分URL / URI的方法
• #conversions：用于执行已配置的转换服务的方法（如果有）。
• #dates：java.util.Date对象的方法：格式化，组件提取等。
• #calendars：类似于#dates，但java.util.Calendar对象。
• #numbers：格式化数字对象的方法。
• #strings：String对象的方法：contains，startsWith，prepending / appending等。
• #objects：一般的对象的方法。
• #bools：布尔评估的方法。
• #arrays：数组的方法。
• #lists：列表方法。
• #sets：集合的方法。
• #maps：地图的方法。
• #aggregates：在数组或集合上创建聚合的方法。
• #ids：处理可能重复的id属性的方法（例如，作为迭代的结果）。

您可以在附录B中查看每个实用程序对象提供的功能。

在我们的主页中重新格式化日期

现在我们了解这些实用程序对象，我们可以使用它们来改变我们在主页中显示日期的方式。而不是在我们这样做HomeController：

SimpleDateFormat dateFormat = new SimpleDateFormat("dd MMMM yyyy");
Calendar cal = Calendar.getInstance();

WebContext ctx = new WebContext(request, servletContext, request.getLocale());
ctx.setVariable("today", dateFormat.format(cal.getTime()));

templateEngine.process("home", ctx, response.getWriter());

......我们可以做到这一点：

WebContext ctx = 
    new WebContext(request, response, servletContext, request.getLocale());
ctx.setVariable("today", Calendar.getInstance());

templateEngine.process("home", ctx, response.getWriter());

...然后在视图层本身中执行日期格式设置：

<p>
  Today is: <span th:text="${#calendars.format(today,'dd MMMM yyyy')}">13 May 2011span>
p>

关文本

4.3选择表达式（星号语法）

变量表达式不仅可以写成${...}，也可以作为*{...}。

但是有一个重要的区别：星号语法评估所选对象上的表达式而不是整个上下文。也就是说，只要没有选定的对象，美元和星号语法就会完全相同。

什么是选定的对象？使用th:object属性的表达式的结果。我们在用户个人资料（userprofile.html）页面中使用一个：

  <div th:object="${session.user}">
    <p>Name: <span th:text="*{firstName}">Sebastianspan>.p>
    <p>Surname: <span th:text="*{lastName}">Pepperspan>.p>
    <p>Nationality: <span th:text="*{nationality}">Saturnspan>.p>
  div>

这完全等同于：

<div>
  <p>Name: <span th:text="${session.user.firstName}">Sebastianspan>.p>
  <p>Surname: <span th:text="${session.user.lastName}">Pepperspan>.p>
  <p>Nationality: <span th:text="${session.user.nationality}">Saturnspan>.p>
div>

当然，美元和星号语法可以混合使用：

<div th:object="${session.user}">
  <p>Name: <span th:text="*{firstName}">Sebastianspan>.p>
  <p>Surname: <span th:text="${session.user.lastName}">Pepperspan>.p>
  <p>Nationality: <span th:text="*{nationality}">Saturnspan>.p>
div>

当对象选择到位时，所选对象也可用作美元表达式作为#object表达式变量：

<div th:object="${session.user}">
  <p>Name: <span th:text="${#object.firstName}">Sebastianspan>.p>
  <p>Surname: <span th:text="${session.user.lastName}">Pepperspan>.p>
  <p>Nationality: <span th:text="*{nationality}">Saturnspan>.p>
div>

如上所述，如果没有执行任何对象选择，则美元和星号语法是等效的。

<div>
  <p>Name: <span th:text="*{session.user.name}">Sebastianspan>.p>
  <p>Surname: <span th:text="*{session.user.surname}">Pepperspan>.p>
  <p>Nationality: <span th:text="*{session.user.nationality}">Saturnspan>.p>
div>

4.4链接URL

由于它们的重要性，URL是Web应用程序模板中的一等公民，而Thymeleaf Standard Dialect具有特殊的语法，@语法：@{...}

有不同类型的网址：

• 绝对网址： http://www.thymeleaf.org
• 相对URL，可以是：
  • 页面相对： user/login.html
  • 上下文相关:( /itemdetails?id=3服务器中的上下文名称将自动添加）
  • 服务器相对:( ~/billing/processInvoice允许在同一服务器中的另一个上下文（=应用程序）中调用URL。
  • 协议相对URL： //code.jquery.com/jquery-2.0.3.min.js

这些表达式的实际处理及其转换为将要输出的URL是通过org.thymeleaf.linkbuilder.ILinkBuilder注册到ITemplateEngine正在使用的对象中的接口的实现来完成的。

默认情况下，此接口的单个​​实现是在类中注册的org.thymeleaf.linkbuilder.StandardLinkBuilder，这对于基于Servlet API的脱机（非Web）和Web方案都是足够的。其他方案（例如与非ServletAPI Web框架的集成）可能需要链接构建器接口的特定实现。

让我们使用这种新语法。符合th:href属性：

<a href="details.html" 
   th:href="@{http://localhost:8080/gtvg/order/details(orderId=${o.id})}">viewa>


<a href="details.html" th:href="@{/order/details(orderId=${o.id})}">viewa>


<a href="details.html" th:href="@{/order/{orderId}/details(orderId=${o.id})}">viewa>

这里要注意的一些事情：

• th:href是一个修饰符属性：一旦处理，它将计算要使用的链接URL并将该值设置href为标记的属性。
• 我们被允许对URL参数使用表达式（如您所见orderId=${o.id}）。还将自动执行所需的URL参数编码操作。
• 如果需要几个参数，这些参数将用逗号分隔： @{/order/process(execId=${execId},execType='FAST')}
• URL路径中也允许使用变量模板： @{/order/{orderId}/details(orderId=${orderId})}
• 以/（例如:)开头的相对URL /order/details将自动以应用程序上下文名称为前缀。
• 如果未启用cookie或尚未知道cookie，则";jsessionid=..."可能会在相对URL中添加后缀，以便保留会话。这称为URL重写，Thymeleaf允许您通过response.encodeURL(...)Servlet API为每个URL 插入自己的重写过滤器。
• 该th:href属性允许我们（可选）href在我们的模板中具有工作静态属性，以便我们的模板链接在直接打开以进行原型设计时仍可由浏览器导航。

与消息语法（#{...}）的情况一样，URL基数也可以是评估另一个表达式的结果：

<a th:href="@{${url}(orderId=${o.id})}">viewa>
<a th:href="@{'/details/'+${user.login}(orderId=${o.id})}">viewa>

我们主页的菜单

既然我们知道如何创建链接URL，那么在我们的主页中为网站中的其他一些页面添加一个小菜单呢？

<p>Please select an optionp>
<ol>
  <li><a href="product/list.html" th:href="@{/product/list}">Product Lista>li>
  <li><a href="order/list.html" th:href="@{/order/list}">Order Lista>li>
  <li><a href="subscribe.html" th:href="@{/subscribe}">Subscribe to our Newslettera>li>
  <li><a href="userprofile.html" th:href="@{/userprofile}">See User Profilea>li>
ol>

服务器根目录相对URL

可以使用其他语法来创建服务器根相对（而不是上下文根相对）URL，以便链接到同一服务器中的不同上下文。这些URL将被指定为@{~/path/to/something}

4.5片段

片段表达式是表示标记片段并将其移动到模板周围的简单方法。这允许我们复制它们，将它们作为参数传递给其他模板，等等。

最常见的用途是使用th:insert或进行片段插入th:replace（在后面的部分中将详细介绍）：

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

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

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

本教程后面有一整节专门介绍模板布局，包括对片段表达式的更深入解释。

4.6文字

文字文字

文本文字只是在单引号之间指定的字符串。它们可以包含任何字符，但您应该使用它们中的任何单引号\'。

<p>
  Now you are looking at a <span th:text="'working web application'">template filespan>.
p>

数字文字

数字文字只是：数字。

<p>The year is <span th:text="2013">1492span>.p>
<p>In two years, it will be <span th:text="2013 + 2">1494span>.p>

布尔文字

布尔文字是true和false。例如：

<div th:if="${user.isAdmin()} == false"> ...

在这个例子中，它== false被写在大括号外面，因此是Thymeleaf来处理它。如果它是在大括号内写的，那么它将由OGNL / SpringEL引擎负责：

<div th:if="${user.isAdmin() == false}"> ...

null文字

该null文本也可用于：

<div th:if="${variable.something} == null"> ...

文字代币

实际上，数字，布尔和空文字是文字标记的特例。

这些令牌允许在标准表达式中进行一些简化。它们的工作方式与文本文字（'...'）完全相同，但它们只允许使用字母（A-Z和a-z），数字（0-9），括号（[和]），点（.），连字符（-）和下划线（_）。所以没有空格，没有逗号等。

好的部分？令牌不需要任何围绕它们的引号。所以我们可以这样做：

<div th:class="content">...div>

代替：

<div th:class="'content'">...div>

和变量的

4.7附加文本

文本，无论是文字还是评估变量或消息表达式的结果，都可以使用+运算符轻松附加：

<span th:text="'The name of the user is ' + ${user.name}">

4.8字面替换

文字替换允许轻松格式化包含变量值的字符串，而无需附加文字'...' + '...'。

这些替换必须用竖线（|）包围，如：

<span th:text="|Welcome to our application, ${user.name}!|">

这相当于：

<span th:text="'Welcome to our application, ' + ${user.name} + '!'">

文字替换可以与其他类型的表达相结合：

<span th:text="${onevar} + ' ' + |${twovar}, ${threevar}|">

唯一的变量/消息表达式（${...}，*{...}，#{...}）被允许内部|...|字面取代。没有其他文字（'...'），布尔/数字标记，条件表达式等。

4.9算术运算

一些算术运算也可用：+，-，*，/和%。

<div th:with="isEven=(${prodStat.count} % 2 == 0)">

请注意，这些运算符也可以应用于OGNL变量表达式本身（在这种情况下，将由OGNL而不是Thymeleaf标准表达式引擎执行）：

<div th:with="isEven=${prodStat.count % 2 == 0}">

请注意，其中一些运算符存在文本别名：div（/），mod（%）。

4.10比较器和平等

在表达式中的值可以与进行比较>，<，>=和<=符号，以及==和!=运营商可以被用来检查是否相等（或缺乏）。请注意，XML确定不应在属性值中使用<和>符号，因此应将它们替换为<和>。

<div th:if="${prodStat.count} > 1">
<span th:text="'Execution mode is ' + ( (${execMode} == 'dev')? 'Development' : 'Production')">

更简单的替代方法可能是使用某些运算符存在的文本别名：gt（>），lt（<），ge（>=），le（<=），not（!）。还eq（==），neq/ ne（!=）。

4.11条件表达式

条件表达式仅用于评估两个表达式中的一个，具体取决于评估条件的结果（它本身就是另一个表达式）。

让我们来看一个例子片段（引入另一个属性修改器，th:class）：

<tr th:class="${row.even}? 'even' : 'odd'">
  ...
tr>

条件表达式（condition，then和else）的所有三个部分本身都是表达式，这意味着它们可以是变量（${...}，*{...}），消息（#{...}），URL（@{...}）或文字（'...'）。

条件表达式也可以使用括号嵌套：

<tr th:class="${row.even}? (${row.first}? 'first' : 'even') : 'odd'">
  ...
tr>

其他表达式也可以省略，在这种情况下，如果条件为false，则返回null值：

<tr th:class="${row.even}? 'alt'">
  ...
tr>

4.12默认表达式（Elvis运算符）

一个默认的表情是一种特殊的条件值的没有那么一部分。它等同于某些语言（如Groovy）中存在的Elvis运算符，允许您指定两个表达式：如果它不计算为null，则使用第一个表达式，但如果确实如此，则使用第二个表达式。

让我们在用户个人资料页面中看到它：

<div th:object="${session.user}">
  ...
  <p>Age: <span th:text="*{age}?: '(no age specified)'">27span>.p>
div>

正如您所看到的，运算符是?:，并且我们在此处使用它来指定名称的默认值（在这种情况下为文字值），仅当评估结果*{age}为null时。因此，这相当于：

<p>Age: <span th:text="*{age != null}? *{age} : '(no age specified)'">27span>.p>

与条件值一样，它们可以包含括号之间的嵌套表达式：

<p>
  Name: 
  <span th:text="*{firstName}?: (*{admin}? 'Admin' : #{default.username})">Sebastianspan>
p>

4.13无操作令牌

No-Operation标记由下划线符号（_）表示。

这个标记背后的想法是指定表达式的期望结果是什么都不做，即完全就像可处理属性（例如th:text）根本不存在一样。

除了其他可能性之外，这允许开发人员将原型文本用作默认值。例如，而不是：

<span th:text="${user.name} ?: 'no user authenticated'">...span>

...我们可以直接使用“无用户身份验证”作为原型文本，从设计的角度来看，这会使代码更简洁，更通用：

<span th:text="${user.name} ?: _">no user authenticatedspan>

4.14数据转换/格式化

Thymeleaf 为variable（）和selection（）表达式定义了一个双括号语法，允许我们通过配置的转换服务应用数据转换。${...}*{...}

它基本上是这样的：

<td th:text="${{user.lastAccessDate}}">...td>

注意到那里的双支撑？：${{...}}。这指示Thymeleaf将user.lastAccessDate表达式的结果传递给转换服务，并要求它在写入结果之前执行格式化操作（转换为String）。

假设它user.lastAccessDate是类型java.util.Calendar，如果已经注册了转换服务（实现IStandardConversionService）并且包含有效的转换Calendar -> String，则将应用它。

IStandardConversionService（StandardConversionService类）的默认实现只是.toString()在转换为的任何对象上执行String。有关如何注册自定义转换服务实现的更多信息，请查看“ 更多配置”部分。

官方thymeleaf-spring3和thymeleaf-spring4集成软件包的透明集成了Spring自己Thymeleaf的转换服务机制转换服务的基础设施，所以在Spring配置宣称，转换服务和格式化将进行自动获得${{...}}和*{{...}}表达。

4.15预处理

除了用于表达式处理的所有这些功能外，Thymeleaf还具有预处理表达式的功能。

预处理是在正常表达式之前完成的表达式的执行，它允许修改最终将被执行的表达式。

预处理表达式与普通表达式完全相同，但显示为双下划线符号（如__${expression}__）。

让我们假设我们有一个Messages_fr.properties包含OGNL表达式的i18n 条目，该表达式调用特定于语言的静态方法，如：

article.text=@myapp.translator.Translator@translateToFrench({0})

......和a Messages_es.properties equivalent：

article.text=@myapp.translator.Translator@translateToSpanish({0})

我们可以创建一个标记片段，根据语言环境评估一个表达式或另一个表达式。为此，我们将首先选择表达式（通过预处理），然后让Thymeleaf执行它：

<p th:text="${__#{article.text('textVar')}__}">Some text here...p>

请注意，法语区域设置的预处理步骤将创建以下等效项：

<p th:text="${@myapp.translator.Translator@translateToFrench(textVar)}">Some text here...p>

__可以使用在属性中对预处理字符串进行转义\_\_。

5设置属性值

本章将解释我们在标记中设置（或修改）属性值的方式。

5.1设置任何属性的值

假设我们的网站发布了一个时事通讯，我们希望我们的用户能够订阅它，所以我们创建一个/WEB-INF/templates/subscribe.html带有以下形式的模板：

<form action="subscribe.html">
  <fieldset>
    <input type="text" name="email" />
    <input type="submit" value="Subscribe!" />
  fieldset>
form>

与Thymeleaf一样，此模板更像是静态原型，而不是Web应用程序的模板。首先，action我们表单中的属性静态链接到模板文件本身，因此没有地方可以进行有用的URL重写。其次，value提交按钮中的属性使其显示英文文本，但我们希望它能够国际化。

然后输入th:attr属性，以及更改其设置的标记属性值的能力：

<form action="subscribe.html" th:attr="action=@{/subscribe}">
  <fieldset>
    <input type="text" name="email" />
    <input type="submit" value="Subscribe!" th:attr="value=#{subscribe.submit}"/>
  fieldset>
form>

这个概念非常简单：th:attr只需要一个为属性赋值的表达式。创建了相应的控制器和消息文件后，处理该文件的结果将是：

<form action="/gtvg/subscribe">
  <fieldset>
    <input type="text" name="email" />
    <input type="submit" value="¡Suscríbe!"/>
  fieldset>
form>

除了新的属性值之外，您还可以看到applicacion上下文名称已自动添加到URL基础中/gtvg/subscribe，如前一章所述。

但是，如果我们想一次设置多个属性呢？XML规则不允许您在标记中设置两次属性，因此th:attr将采用以逗号分隔的分配列表，例如：

<img src="../../images/gtvglogo.png" 
     th:attr="src=@{/images/gtvglogo.png},title=#{logo},alt=#{logo}" />

给定所需的消息文件，这将输出：

<img src="/gtgv/images/gtvglogo.png" title="Logo de Good Thymes" alt="Logo de Good Thymes" />

5.2为特定属性设置值

到现在为止，您可能会想到以下内容：

<input type="submit" value="Subscribe!" th:attr="value=#{subscribe.submit}"/>

......是一个非常丑陋的标记。在属性值中指定赋值可能非常实用，但如果您必须始终执行此操作，则它不是创建模板的最佳方式。

Thymeleaf同意你的意见，这就是th:attr模板中几乎没有使用的原因。通常，您将使用th:*其任务设置特定标记属性的其他属性（而不仅仅是任何属性th:attr）。

例如，要设置value属性，请使用th:value：

<input type="submit" value="Subscribe!" th:value="#{subscribe.submit}"/>

这看起来好多了！让我们尝试action对form标记中的属性执行相同操作：

<form action="subscribe.html" th:action="@{/subscribe}">

你还记得th:href我们home.html之前放过的东西吗？它们正是同样的属性：

<li><a href="product/list.html" th:href="@{/product/list}">Product Lista>li>

有很多这样的属性，每个属性都针对特定的HTML5属性：

th:abbr	th:accept	th:accept-charset
th:accesskey	th:action	th:align
th:alt	th:archive	th:audio
th:autocomplete	th:axis	th:background
th:bgcolor	th:border	th:cellpadding
th:cellspacing	th:challenge	th:charset
th:cite	th:class	th:classid
th:codebase	th:codetype	th:cols
th:colspan	th:compact	th:content
th:contenteditable	th:contextmenu	th:data
th:datetime	th:dir	th:draggable
th:dropzone	th:enctype	th:for
th:form	th:formaction	th:formenctype
th:formmethod	th:formtarget	th:fragment
th:frame	th:frameborder	th:headers
th:height	th:high	th:href
th:hreflang	th:hspace	th:http-equiv
th:icon	th:id	th:inline
th:keytype	th:kind	th:label
th:lang	th:list	th:longdesc
th:low	th:manifest	th:marginheight
th:marginwidth	th:max	th:maxlength
th:media	th:method	th:min
th:name	th:onabort	th:onafterprint
th:onbeforeprint	th:onbeforeunload	th:onblur
th:oncanplay	th:oncanplaythrough	th:onchange
th:onclick	th:oncontextmenu	th:ondblclick
th:ondrag	th:ondragend	th:ondragenter
th:ondragleave	th:ondragover	th:ondragstart
th:ondrop	th:ondurationchange	th:onemptied
th:onended	th:onerror	th:onfocus
th:onformchange	th:onforminput	th:onhashchange
th:oninput	th:oninvalid	th:onkeydown
th:onkeypress	th:onkeyup	th:onload
th:onloadeddata	th:onloadedmetadata	th:onloadstart
th:onmessage	th:onmousedown	th:onmousemove
th:onmouseout	th:onmouseover	th:onmouseup
th:onmousewheel	th:onoffline	th:ononline
th:onpause	th:onplay	th:onplaying
th:onpopstate	th:onprogress	th:onratechange
th:onreadystatechange	th:onredo	th:onreset
th:onresize	th:onscroll	th:onseeked
th:onseeking	th:onselect	th:onshow
th:onstalled	th:onstorage	th:onsubmit
th:onsuspend	th:ontimeupdate	th:onundo
th:onunload	th:onvolumechange	th:onwaiting
th:optimum	th:pattern	th:placeholder
th:poster	th:preload	th:radiogroup
th:rel	th:rev	th:rows
th:rowspan	th:rules	th:sandbox
th:scheme	th:scope	th:scrolling
th:size	th:sizes	th:span
th:spellcheck	th:src	th:srclang
th:standby	th:start	th:step
th:style	th:summary	th:tabindex
th:target	th:title	th:type
th:usemap	th:value	th:valuetype
th:vspace	th:width	th:wrap
th:xmlbase	th:xmllang	th:xmlspace

5.3一次设置多个值

有两个叫比较特殊的属性th:alt-title和th:lang-xmllang可用于同时设置两个属性相同的值。特别：

• th:alt-title将设置alt和title。
• th:lang-xmllang将设置lang和xml:lang。

对于我们的GTVG主页，这将允许我们替换：

<img src="../../images/gtvglogo.png" 
     th:attr="src=@{/images/gtvglogo.png},title=#{logo},alt=#{logo}" />

......或者这个，相当于：

<img src="../../images/gtvglogo.png" 
     th:src="@{/images/gtvglogo.png}" th:title="#{logo}" th:alt="#{logo}" />

…有了这个：

<img src="../../images/gtvglogo.png" 
     th:src="@{/images/gtvglogo.png}" th:alt-title="#{logo}" />

5.4附加和预先

Thymeleaf还提供了th:attrappend和th:attrprepend属性，它们将评估结果附加（后缀）或前置（前缀）到现有属性值。

例如，您可能希望将要添加的CSS类的名称（未设置，仅添加）存储到上下文变量中的某个按钮，因为要使用的特定CSS类将取决于用户执行的操作。之前：

<input type="button" value="Do it!" class="btn" th:attrappend="class=${' ' + cssStyle}" />

如果您在cssStyle变量设置为的情况下处理此模板"warning"，您将获得：

<input type="button" value="Do it!" class="btn warning" />

标准方言中还有两个特定的附加属性：th:classappend和th:styleappend属性，用于向元素添加CSS类或样式片段而不覆盖现有元素：

<tr th:each="prod : ${prods}" class="row" th:classappend="${prodStat.odd}? 'odd'">

（不要担心该th:each属性。它是一个迭代属性，我们稍后会讨论它。）

5.5固定值布尔属性

HTML具有布尔属性的概念，没有值的属性和一个值的前提意味着值为“true”。在XHTML中，这些属性只占用1个值，这本身就是一个值。

例如，checked：

<input type="checkbox" name="option2" checked /> 
<input type="checkbox" name="option1" checked="checked" /> 

标准方言包含允许您通过评估条件来设置这些属性的属性，因此如果计算为true，则属性将设置为其固定值，如果计算为false，则不会设置该属性：

<input type="checkbox" name="active" th:checked="${user.active}" />

标准方言中存在以下固定值布尔属性：

th:async	th:autofocus	th:autoplay
th:checked	th:controls	th:declare
th:default	th:defer	th:disabled
th:formnovalidate	th:hidden	th:ismap
th:loop	th:multiple	th:novalidate
th:nowrap	th:open	th:pubdate
th:readonly	th:required	th:reversed
th:scoped	th:seamless	th:selected

更多信息

5.6设置任何属性的值（默认属性处理器）

Thymeleaf提供了一个默认属性处理器，允许我们设置任何属性的值，即使th:*在标准方言中没有为它定义特定的处理器。

所以类似于：

<span th:whatever="${user.name}">...span>

将导致：

<span whatever="John Apricot">...span>

5.7支持HTML5友好的属性和元素名称

也可以使用完全不同的语法以更加HTML5友好的方式将处理器应用于模板。

<table>
    <tr data-th-each="user : ${users}">
        <td data-th-text="${user.login}">...td>
        <td data-th-text="${user.name}">...td>
    tr>
table>

该data-{prefix}-{name}语法编写自定义属性在HTML5中，而无需开发人员使用任何命名空间的名称，如标准的方式th:*。Thymeleaf使所有方言（不仅是标准方言）自动使用此语法。

还有一种语法来指定自定义标签：{prefix}-{name}，它遵循W3C自定义元素规范（较大的W3C Web组件规范的一部分）。例如，这可以用于th:block元素（或者也可以th-block），这将在后面的部分中解释。

重要提示：此语法是对命名空间语法的补充th:*，它不会替换它。完全没有意图在将来弃用命名空间语法。

6迭代

到目前为止，我们已经创建了一个主页，一个用户个人资料页面以及一个允许用户订阅我们的新闻通讯的页面......但是我们的产品呢？为此，我们需要一种方法来迭代集合中的项目以构建我们的产品页面。

6.1迭代基础知识

要在我们的/WEB-INF/templates/product/list.html页面中显示产品，我们将使用表格。我们的每个产品都会连续显示（一个元素），因此对于我们的模板，我们需要创建一个模板行 - 一个可以说明我们希望如何显示每个产品的模板行 - 然后指示Thymeleaf重复它，每个产品一次。

标准方言为我们提供了一个属性：th:each。

使用th：each

对于我们的产品列表页面，我们需要一个控制器方法，从服务层检索产品列表并将其添加到模板上下文中：

public void process(
        final HttpServletRequest request, final HttpServletResponse response,
        final ServletContext servletContext, final ITemplateEngine templateEngine)
        throws Exception {
    
    ProductService productService = new ProductService();
    List allProducts = productService.findAll(); 
    
    WebContext ctx = new WebContext(request, response, servletContext, request.getLocale());
    ctx.setVariable("prods", allProducts);
    
    templateEngine.process("product/list", ctx, response.getWriter());
    
}

然后我们将th:each在我们的模板中使用迭代产品列表：

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

  <head>
    <title>Good Thymes Virtual Grocerytitle>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" media="all" 
          href="../../../css/gtvg.css" th:href="@{/css/gtvg.css}" />
  head>

  <body>

    <h1>Product listh1>
  
    <table>
      <tr>
        <th>NAMEth>
        <th>PRICEth>
        <th>IN STOCKth>
      tr>
      <tr th:each="prod : ${prods}">
        <td th:text="${prod.name}">Onionstd>
        <td th:text="${prod.price}">2.41td>
        <td th:text="${prod.inStock}? #{true} : #{false}">yestd>
      tr>
    table>
  
    <p>
      <a href="../home.html" th:href="@{/}">Return to homea>
    p>

  body>

html>

也就是说prod : ${prods}您在上面看到的属性值是指“用于评估的结果的每个元素${prods}，重复模板的该片段，用在变量称为刺当前元素”。让我们给出一个我们看到的每个事物的名称：

• 我们将调用${prods}的迭代式或迭代变量。
• 我们将调用prod的迭代变量或者干脆ITER变量。

请注意，proditer变量的作用域是元素，这意味着它可用于内部标记。

可重复的值

该java.util.List班是不是可以用于Thymeleaf迭代onlyvalue。有一组非常完整的对象被属性认为是可迭代的th:each：

• 任何对象实现 java.util.Iterable
• 任何对象实现java.util.Enumeration。
• 任何实现的对象java.util.Iterator，其值将在迭代器返回时使用，而不需要将所有值缓存在内存中。
• 任何对象实现java.util.Map。迭代地图时，iter变量将属于类java.util.Map.Entry。
• 任何数组。
• 任何其他对象都将被视为包含对象本身的单值列表。

6.2保持迭代状态

使用时th:each，Thymeleaf提供了一种机制，可用于跟踪迭代的状态：状态变量。

状态变量在th:each属性中定义，包含以下数据：

• 当前迭代索引，从0开始。这是index属性。
• 当前迭代索引，从1开始。这是count属性。
• 迭代变量中元素的总量。这是size酒店。
• 每次迭代的iter变量。这是current酒店。
• 当前迭代是偶数还是奇数。这些是even/odd布尔属性。
• 当前迭代是否是第一个迭代。这是first布尔属性。
• 当前迭代是否是最后一次迭代。这是last布尔属性。

让我们看看我们如何在前面的例子中使用它：

<table>
  <tr>
    <th>NAMEth>
    <th>PRICEth>
    <th>IN STOCKth>
  tr>
  <tr th:each="prod,iterStat : ${prods}" th:class="${iterStat.odd}? 'odd'">
    <td th:text="${prod.name}">Onionstd>
    <td th:text="${prod.price}">2.41td>
    <td th:text="${prod.inStock}? #{true} : #{false}">yestd>
  tr>
table>

状态变量（iterStat在此示例中）在th:each属性中通过在iter变量本身之后写入其名称来定义，用逗号分隔。就像iter变量一样，状态变量的范围也限定为由包含该th:each属性的标记定义的代码片段。

我们来看看处理模板的结果：

<html>

  <head>
    <title>Good Thymes Virtual Grocerytitle>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
    <link rel="stylesheet" type="text/css" media="all" href="/gtvg/css/gtvg.css" />
  head>

  <body>

    <h1>Product listh1>
  
    <table>
      <tr>
        <th>NAMEth>
        <th>PRICEth>
        <th>IN STOCKth>
      tr>
      <tr class="odd">
        <td>Fresh Sweet Basiltd>
        <td>4.99td>
        <td>yestd>
      tr>
      <tr>
        <td>Italian Tomatotd>
        <td>1.25td>
        <td>notd>
      tr>
      <tr class="odd">
        <td>Yellow Bell Peppertd>
        <td>2.50td>
        <td>yestd>
      tr>
      <tr>
        <td>Old Cheddartd>
        <td>18.75td>
        <td>yestd>
      tr>
    table>
  
    <p>
      <a href="/gtvg/" shape="rect">Return to homea>
    p>

  body>
  
html>

请注意，我们的迭代状态变量已经完美地工作，odd仅将CSS类建立到奇数行。

如果您没有显式设置状态变量，Thymeleaf将始终通过后缀Stat为迭代变量的名称为您创建一个：

<table>
  <tr>
    <th>NAMEth>
    <th>PRICEth>
    <th>IN STOCKth>
  tr>
  <tr th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'">
    <td th:text="${prod.name}">Onionstd>
    <td th:text="${prod.price}">2.41td>
    <td th:text="${prod.inStock}? #{true} : #{false}">yestd>
  tr>
table>

6.3通过延迟检索数据进行优化

有时我们可能希望优化数据集合的检索（例如，从数据库中），以便只有在真正使用它们时才会检索这些集合。

实际上，这可以应用于任何数据片段，但考虑到内存中集合可能具有的大小，检索要迭代的集合是此方案的最常见情况。

为了支持这一点，Thymeleaf提供了一种懒惰加载上下文变量的机制。实现ILazyContextVariable接口的上下文变量- 最有可能通过扩展其LazyContextVariable默认实现 - 将在执行时解决。例如：

context.setVariable(
     "users",
     new LazyContextVariable>() {
         @Override
         protected List loadValue() {
             return databaseRepository.findAllUsers();
         }
     });

可以在不知道其惰性的情况下使用此变量，例如：

<ul>
  <li th:each="u : ${users}" th:text="${u.name}">user nameli>
ul>

但与此同时，loadValue()如果在代码中condition进行求值，则永远不会被初始化（它的方法永远不会被调用）false：

<ul th:if="${condition}">
  <li th:each="u : ${users}" th:text="${u.name}">user nameli>
ul>

7条件评估

7.1简单条件：“if”和“除非”

有时，如果满足某个条件，您将需要模板的片段才会出现在结果中。

例如，假设我们希望在产品表中显示一列，其中包含每个产品的评论数量，如果有任何评论，则指向该产品的评论详细信息页面的链接。

为此，我们将使用以下th:if属性：

<table>
  <tr>
    <th>NAMEth>
    <th>PRICEth>
    <th>IN STOCKth>
    <th>COMMENTSth>
  tr>
  <tr th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'">
    <td th:text="${prod.name}">Onionstd>
    <td th:text="${prod.price}">2.41td>
    <td th:text="${prod.inStock}? #{true} : #{false}">yestd>
    <td>
      <span th:text="${#lists.size(prod.comments)}">2span> comment/s
      <a href="comments.html" 
         th:href="@{/product/comments(prodId=${prod.id})}" 
         th:if="${not #lists.isEmpty(prod.comments)}">viewa>
    td>
  tr>
table>

这里有很多东西要看，所以让我们关注重要的一点：

<a href="comments.html"
   th:href="@{/product/comments(prodId=${prod.id})}" 
   th:if="${not #lists.isEmpty(prod.comments)}">viewa>

这将创建指向评论页面（带有URL /product/comments）的链接，其prodId参数设置为id产品的参数，但仅限于产品有任何评论。

我们来看看生成的标记：

<table>
  <tr>
    <th>NAMEth>
    <th>PRICEth>
    <th>IN STOCKth>
    <th>COMMENTSth>
  tr>
  <tr>
    <td>Fresh Sweet Basiltd>
    <td>4.99td>
    <td>yestd>
    <td>
      <span>0span> comment/s
    td>
  tr>
  <tr class="odd">
    <td>Italian Tomatotd>
    <td>1.25td>
    <td>notd>
    <td>
      <span>2span> comment/s
      <a href="/gtvg/product/comments?prodId=2">viewa>
    td>
  tr>
  <tr>
    <td>Yellow Bell Peppertd>
    <td>2.50td>
    <td>yestd>
    <td>
      <span>0span> comment/s
    td>
  tr>
  <tr class="odd">
    <td>Old Cheddartd>
    <td>18.75td>
    <td>yestd>
    <td>
      <span>1span> comment/s
      <a href="/gtvg/product/comments?prodId=4">viewa>
    td>
  tr>
table>

完善！这正是我们想要的。

请注意，该th:if属性不仅会评估布尔条件。它的功能稍微超出了它，它将按照true以下规则评估指定的表达式：

• 如果value不为null：
  • 如果value是布尔值，则为true。
  • 如果value是数字且不为零
  • 如果value是一个字符且不为零
  • 如果value是String并且不是“false”，“off”或“no”
  • 如果value不是布尔值，数字，字符或字符串。
• （如果value为null，则th：if将计算为false）。

此外，th:if还有一个inverse属性，th:unless我们可以在前面的示例中使用它，而不是not在OGNL表达式中使用：

<a href="comments.html"
   th:href="@{/comments(prodId=${prod.id})}" 
   th:unless="${#lists.isEmpty(prod.comments)}">viewa>

7.2切换语句

还有一种方法可以使用Java中的等效开关结构有条件地显示内容：th:switch/ th:case属性集。

<div th:switch="${user.role}">
  <p th:case="'admin'">User is an administratorp>
  <p th:case="#{roles.manager}">User is a managerp>
div>

请注意，只要th:case评估true一个th:case属性，就会将同一切换上下文中的每个其他属性评估为false。

默认选项指定为th:case="*"：

<div th:switch="${user.role}">
  <p th:case="'admin'">User is an administratorp>
  <p th:case="#{roles.manager}">User is a managerp>
  <p th:case="*">User is some other thingp>
div>

8模板布局

8.1包括模板片段

定义和引用片段

在我们的模板中，我们经常需要包含其他模板中的部分，页脚，标题，菜单等部分......

为了做到这一点，Thymeleaf需要我们定义这些部分，“片段”，以便包含，这可以使用th:fragment属性来完成。

假设我们要在所有杂货页面上添加标准版权页脚，因此我们创建一个/WEB-INF/templates/footer.html包含以下代码的文件：

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

  <body>
  
    <div th:fragment="copy">
      © 2011 The Good Thymes Virtual Grocery
    div>
  
  body>
  
html>

上面的代码定义了一个名为的片段copy，我们可以使用其中一个th:insert或th:replace属性轻松地在我们的主页中包含这些片段（并且th:include，尽管自Thymeleaf 3.0以来不再推荐使用它）：

<body>

  ...

  <div th:insert="~{footer :: copy}">div>
  
body>

请注意，th:insert需要一个片段表达式（~{...}），它是一个导致片段的表达式。在上面的例子中，这是一个非复杂的片段表达式，（~{，}）封闭是完全可选的，所以上面的代码相当于：

<body>

  ...

  <div th:insert="footer :: copy">div>
  
body>

片段规范语法

片段表达式的语法非常简单。有三种不同的格式：

• "~{templatename::selector}"包括在名为的模板上应用指定标记选择器而产生的片段templatename。请注意，selector可以仅仅是一个片段的名字，所以你可以指定为简单的东西~{templatename::fragmentname}就像在~{footer :: copy}上面。

  标记选择器语法由底层的AttoParser解析库定义，类似于XPath表达式或CSS选择器。有关详细信息，请参阅附录C.

• "~{templatename}"包含名为的完整模板templatename。

  请注意，您在th:insert/ th:replacetags中使用的模板名称必须由模板引擎当前使用的模板解析器解析。

• ~{::selector}"或"~{this::selector}"插入来自同一模板的片段，进行匹配selector。如果在表达式出现的模板上找不到，则模板调用（插入）的堆栈将遍历最初处理的模板（根），直到selector在某个级别匹配。

双方templatename并selector在上面的例子可以是全功能的表达式（甚至条件语句！），如：

<div th:insert="footer :: (${user.isAdmin}? #{footer.admin} : #{footer.normaluser})">div>

再次注意周围的~{...}包络在th:insert/中是如何可选的th:replace。

片段可以包含任何th:*属性。一旦将片段包含在目标模板（具有th:insert/ th:replaceattribute的模板）中，就会评估这些属性，并且它们将能够引用此目标模板中定义的任何上下文变量。

这种片段方法的一大优点是，您可以在浏览器完全可显示的页面中编写片段，具有完整且有效的标记结构，同时仍保留使Thymeleaf将其包含在其他模板中的能力。

没有引用片段 th:fragment

由于标记选择器的强大功能，我们可以包含不使用任何th:fragment属性的片段。它甚至可以是来自不同应用程序的标记代码，完全不了解Thymeleaf：

...
<div id="copy-section">
  © 2011 The Good Thymes Virtual Grocery
div>
...

我们可以使用上面的片段，通过其id属性简单地引用它，与CSS选择器类似：

<body>

  ...

  <div th:insert="~{footer :: #copy-section}">div>
  
body>

th:insert和th:replace（和th:include）之间的区别

和之间有什么区别th:insert和th:replace（和th:include，因为3.0不推荐）？

• th:insert 是最简单的：它只是插入指定的片段作为其主机标签的主体。

• th:replace实际上用指定的片段替换它的主机标签。

• th:include类似于th:insert，但不是插入片段，它只插入此片段的内容。

所以像这样的HTML片段：

<footer th:fragment="copy">
  © 2011 The Good Thymes Virtual Grocery
footer>

...在主机

标签中包含三次，如下所示：

<body>

  ...

  <div th:insert="footer :: copy">div>

  <div th:replace="footer :: copy">div>

  <div th:include="footer :: copy">div>
  
body>

......将导致：

<body>

  ...

  <div>
    <footer>
      © 2011 The Good Thymes Virtual Grocery
    footer>
  div>

  <footer>
    © 2011 The Good Thymes Virtual Grocery
  footer>

  <div>
    © 2011 The Good Thymes Virtual Grocery
  div>
  
body>

8.2可参数化的片段签名

为了为模板片段创建更像函数的机制，使用定义的片段th:fragment可以指定一组参数：

<div th:fragment="frag (onevar,twovar)">
    <p th:text="${onevar} + ' - ' + ${twovar}">...p>
div>

这需要使用这两种语法之一来从th:insert或调用片段th:replace：

<div th:replace="::frag (${value1},${value2})">...div>
<div th:replace="::frag (onevar=${value1},twovar=${value2})">...div>

请注意，在最后一个选项中，顺序并不重要：

<div th:replace="::frag (twovar=${value2},onevar=${value1})">...div>

片段局部变量没有片段参数

即使片段定义没有这样的参数：

<div th:fragment="frag">
    ...
div>

我们可以使用上面指定的第二种语法来调用它们（只有第二种语法）：

<div th:replace="::frag (onevar=${value1},twovar=${value2})">

这将相当于组合th:replace和th:with：

<div th:replace="::frag" th:with="onevar=${value1},twovar=${value2}">

请注意，片段的局部变量的这种规范 - 无论它是否具有参数签名 - 都不会导致在执行之前清空上下文。片段仍然可以访问调用模板中使用的每个上下文变量，就像它们当前一样。

th：断言in-template断言

该th:assert属性可以指定一个以逗号分隔的表达式列表，这些表达式应该被评估并为每次评估生成true，否则会引发异常。

<div th:assert="${onevar},(${twovar} != 43)">...div>

这对于验证片段签名的参数非常方便：

<header th:fragment="contentheader(title)" th:assert="${!#strings.isEmpty(title)}">...header>

8.3灵活的布局：仅仅是片段插入

由于片段表达式，我们可以为不是文本，数字，bean对象的片段指定参数......而是指定标记片段。

这允许我们以一种方式创建我们的片段，使得它们可以通过来自调用模板的标记来丰富，从而产生非常灵活的模板布局机制。

注意在下面的片段中使用title和links变量：

<head th:fragment="common_header(title,links)">

  <title th:replace="${title}">The awesome applicationtitle>

  
  <link rel="stylesheet" type="text/css" media="all" th:href="@{/css/awesomeapp.css}">
  <link rel="shortcut icon" th:href="@{/images/favicon.ico}">
  <script type="text/javascript" th:src="@{/sh/scripts/codebase.js}">script>

  
  <th:block th:replace="${links}" />

head>

我们现在可以将这个片段称为：

...
<head th:replace="base :: common_header(~{::title},~{::link})">

  <title>Awesome - Maintitle>

  <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
  <link rel="stylesheet" th:href="@{/themes/smoothness/jquery-ui.css}">

head>
...

...结果将使用我们的调用模板中的实际