This is the main content of the page.
Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎,能够处理HTML、XML、JavaScript、CSS、TEXT、RAW这六种模板。
这六种模版模式包含两种标记模板模式(HTML和XML),三种⽂本模板模式(TEXT,JAVASCRIPT和CSS)和⼀个⽆操作模板模式(RAW)。
①简单表达式
变量表达式: ${…}
选择变量表达式: *{…}
消息表达: #{…}
链接URL表达式: @{…}
片段表达式: ~{…}
②文字
文本文字:‘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) : (else)
默认: (value) ?: (defaultvalue)
⑧特殊符号
无操作: _
所有这些功能都可以组合和嵌套:
'User is of type ' + (${user.isAdmin()} ? 'Administrator' : (${user.type} ?: 'Unknown'))
功能介绍:替换元素的id属性。
案例:
这里将input元素的id属性设置为字符串'xxx'与collect.id值的拼接。
功能介绍:替换元素的文本内容。
案例:
description
这里将p元素的文本内容替换为collect.description的值。如果collect.description不存在,将显示默认值description。
功能介绍:支持HTML格式的文本替换。
案例:
content
这里将p元素的文本内容替换为htmlcontent的值,且该值中的HTML标签将被解析并显示。
功能介绍:选择一个对象,并将其作为后续属性的上下文。
案例:
功能介绍:设置元素的value属性值。
案例:
这里将input元素的value属性值设置为user.name的值。
功能介绍:设置元素的onclick事件处理函数。
案例:
这里将button元素的onclick事件处理函数设置为getCollect()。
功能介绍:迭代集合或数组,并为每个元素生成模板内容。
案例:
功能介绍:根据条件判断,决定是否显示元素。
案例:
Link Text
当userId等于collect.userId时,显示标签。
功能介绍:与th:if相反,当条件不满足时显示元素。
案例:
Login
当session.user不为null时,不显示标签。
功能介绍:设置链接的href属性值。
案例:
Login
这里将标签的href属性值设置为/login的URL。
功能介绍:多路选择,用于根据条件显示不同的内容。
案例:
User is an administrator
User is a regular user
根据user.role的值,显示不同的标签内容。
功能介绍:定义一个可以被其他模板引用的代码片段。
案例:
Alert Content
在其他模板中,可以通过引用alert来包含这个片段。
功能介绍:包含其他模板的某个片段到当前位置。
案例:
这里将layout模板中的定义的 htmlhead 片段来替代。
功能介绍:替换整个标签到引入的文件。这意味着当前位置的标签及其所有子元素将被替换为指定模板中的对应片段。
案例:
在这个例子中,
标签及其所有内容将被fragments/header模板中名为title的片段替换。
功能介绍:用于标签,根据条件判断是否设置selected属性。当条件为真时,该选项将被选中。
案例:
如果xxx.id的值等于configObj.dd的值,则该标签将被设置为选中状态。
功能介绍:用于设置图片标签的src属性,即图片的源地址。
案例:
![App Logo]()
在这个例子中,图片的源地址将被设置为/img/logo.png。@{}表达式用于生成URL。
功能介绍:用于设置表单的action属性,即表单提交的目标地址。
案例:
功能介绍:在Thymeleaf模板引擎中,th:block是一个特殊的属性,它用于在模板中定义一个不渲染到最终HTML输出中的块。尽管th:block本身不会生成任何HTML标签,但它可以用来包含其他的Thymeleaf属性,如条件判断(th:if)、循环(th:each)等,这样可以在不引入额外HTML标签的情况下控制模板的某些部分的渲染。
使用th:block的一个常见场景是当你想要根据条件渲染一组元素,但又不想在条件不成立时引入不必要的父级容器标签。
案例:
User Information
Name: User's Name
Email: User's Email
No user information available.
在这个例子中,th:block被用来根据user对象是否存在来控制内容的渲染。如果user对象非空,则渲染用户名和电子邮件;如果user为空,则渲染一条“No user information available.”的消息。
由于th:block不会生成任何HTML标签,因此最终生成的HTML不会包含任何由th:block引入的额外结构。这有助于保持HTML结构的清晰和简洁。
需要注意的是,虽然th:block不会生成HTML标签,但它仍然是一个Thymeleaf处理过程中的一个逻辑块,因此你可以在其中使用Thymeleaf的其他属性来控制内容的渲染。
功能介绍:在Thymeleaf模板引擎中,th:class是一个属性,用于动态地设置HTML元素的class属性值。它允许你根据模板变量的值或表达式的结果来设置或改变元素的CSS类。这对于条件性地应用样式或响应不同状态非常有用。
案例:
This div will have a dynamic class based on the condition.
在这个例子中,condition是一个布尔类型的模板变量。如果condition为真(true),则
元素的class属性将被设置为active;如果condition为假(false),则class属性将被设置为inactive。
你还可以结合多个CSS类,使用空格分隔:
This div has a base class and a conditional class.
在这个例子中,
元素总是有一个base-class,并且根据condition的值,它还会有一个额外的active-class或inactive-class。
th:class属性也可以与HTML元素上已经存在的class属性一起使用,此时Thymeleaf会合并两者。已存在的class属性通常用于定义元素的默认样式,而th:class则用于根据条件动态地覆盖或添加样式。
例如:
This div has a default class and a dynamic class based on the condition.
在这个例子中,
元素初始时会有一个default-class。然后,Thymeleaf会根据condition的值来添加active或inactive类。最终的class属性值将是default-class和条件类(active或inactive)的组合。
通过使用th:class,你可以轻松地根据模板中的数据和逻辑来动态地控制HTML元素的样式。
变量表达式用于访问模型中的属性。
举例:
说明:
假设后端控制器(如 Spring MVC 控制器)将一个名为 message 的属性放入模型中,其值为 "Hello, World!",则上述代码会渲染为:
Hello, World!
选择变量表达式通常与 th:object 一起使用,用于选择对象属性。
举例:
说明:
假设 user 对象有 name 和 age 两个属性,这段代码将分别显示这两个属性的值。
消息表达式用于显示外部化消息,通常用于国际化,例如,你可能有一个 messages_en.properties 文件用于英语消息,一个 messages_fr.properties 文件用于法语消息等。然后,在 Thymeleaf 模板中,你可以使用消息表达式来引用这些消息,Thymeleaf 会根据当前的语言设置选择正确的消息进行显示。。
举例:
说明:
假设 greeting 是在消息属性文件中定义的一个键,其值为 "Welcome to our website!",则上述代码会渲染为:
Welcome to our website!
链接URL表达式用于创建 URL。
举例:
Home
说明:
第一个例子创建了一个指向 /home 的链接,第二个例子设置表单的提交动作为 /login。Thymeleaf 会自动处理应用的上下文路径。
片段表达式用于标记模板的一个片段,常用于模板包含和替换。
举例:
My Website Header
This is the main content of the page.
说明:
在 layout.html 中,我们使用了 th:insert 和 th:replace 来包含和替换模板片段。
~{commons::header} 表示从名为 commons 的模板中选择名为 header 的片段。th:insert 会将指定片段的内容插入到当前标签内部,而 th:replace 会用指定片段的内容完全替换当前标签及其内容。
这些表达式是 Thymeleaf 模板引擎的基础,它们允许开发者在 HTML 中嵌入丰富的动态内容,从而实现灵活的页面渲染。
假设您有一个名为 message 的变量,想要在 HTML 中显示它:
Default Message
如果 message 的值为 'one text',则输出为:
one text
对于数字,您可能想要格式化输出或进行数学运算。例如,您有一个名为 number 的变量,值为 34:
0
0.00
第一个 标签将直接输出 34,而第二个 标签将输出 34.00,因为使用了数字格式化功能。
对于布尔值,您可以根据条件显示不同的内容:
This is true
This is not true
如果 isTrue 的值为 true,则第一个 标签将显示“This is true”,而第二个 标签不会显示。如果 isTrue 为 false,则情况相反。
处理空值或 null 时,Thymeleaf 提供了空值检查:
Value is:
Value is null
myValue 是 null,则第二个 标签将显示“Value is null”。
使用文字标记(例如作为 CSS 类或 ID)时,可以直接插入:
This div has a dynamic class
如果 className 的值为 'main',则输出为:
This div has a dynamic class
您还可以结合使用这些功能来创建更复杂的模板。例如:
Default Title
Default Description
Number: 000
This content is not active.
在这个例子中,根据 isActive 的值,模板会显示不同的内容。如果 isActive 为 true,则显示标题、描述和一个格式化后的数字;如果为 false,则显示一条消息说明内容不活跃。
在Thymeleaf中,你可以使用表达式来连接字符串。这通常是通过将变量或字面量放在${}或*{}表达式中,然后直接在HTML标签或属性中使用这些表达式来实现的。Thymeleaf会自动计算这些表达式的值,并将它们转换为字符串进行连接。
例如,假设你有两个变量firstName和lastName,你想将它们连接成一个完整的名字:
Full Name
如果firstName的值为"John",lastName的值为"Doe",那么输出将会是:
John Doe
注意,在表达式中使用了单引号来包含空格字符,这是因为空格也是字符串的一部分。
Thymeleaf也支持文本替换,这通常是通过使用${}表达式语法和变量插值来实现的。你可以使用${}来包裹变量名,Thymeleaf会在渲染模板时替换这些表达式为变量的实际值。
你给出的例子|The name is ${name}|是一个文本替换的示例,但这不是Thymeleaf的标准语法。Thymeleaf通常使用${}来包围变量名。正确的写法应该是:
The name is Someone
在这个例子中,th:text属性使用了Thymeleaf的文本替换语法。|...|之间的内容会被当作字面量文本处理,而${name}则会被替换为变量name的实际值。如果name的值为"Alice",那么输出将会是:
The name is Alice
这种文本替换语法特别有用,因为它允许你在输出中包含固定的文本和变量的组合,而无需拼接字符串。
在Thymeleaf模板引擎中,算术运算符(如 +、-、*、/、%)和一元减号运算符都可以用于模板表达式中,以执行数值计算。这些运算符可以直接用于整数和浮点数,并且它们的用法与大多数编程语言中的算术运算符类似。
Sum of values
value1 和 value2 是模板中的变量,它们可以是整数或浮点数。模板引擎将计算这两个值的和,并将结果渲染到 标签的文本内容中。
Difference of values
这里,value1 减去 value2 的结果将被渲染。
Product of values
模板引擎将计算 value1 和 value2 的乘积,并渲染结果。
Quotient of values
这里,value1 除以 value2 的商将被渲染。注意,如果 value2 为零,这将会导致一个错误。
Remainder of division
模板引擎将计算 value1 除以 value2 的余数,并渲染结果。
Negative value
在这个例子中,value 是一个模板变量,其值将被取负后渲染到标签中。
在Thymeleaf中,我们并不直接使用类似于“and”和“or”这样的二进制运算符以及“not”这样的布尔否定运算符来直接在模板表达式中组合逻辑条件。相反,Thymeleaf的表达式语言支持逻辑运算符,但它们的语法与许多编程语言中的语法有所不同。
Thymeleaf 使用 && 来表示逻辑与(and),|| 来表示逻辑或(or),而 ! 用于逻辑非(not)。
Both condition1 and condition2 are true.
在这个例子中,只有当 condition1 和 condition2 都为 true 时,元素才会被渲染。
Either condition1 or condition2 (or both) are true.
在这个例子中,只要 condition1 或 condition2 其中一个为 true(或两者都为 true),元素就会被渲染。
The condition is not true.
在这个例子中,如果 condition 为 false,则 元素会被渲染。逻辑非运算符 ! 用于否定一个条件。
在Thymeleaf中,比较运算符用于在表达式中比较两个值的大小或是否相等。Thymeleaf支持标准的比较运算符,如大于(>)、小于()、大于等于(>=)、小于等于(),以及等号运算符(==)和不等号运算符(!=)。这些运算符在Thymeleaf模板中用于控制条件渲染和逻辑判断。
Value 1 is greater than Value 2
Value 1 is less than Value 2
Value 1 is greater than or equal to Value 2
Value 1 is less than or equal to Value 2
在上面的例子中,th:if属性用于判断条件,并根据条件是否成立来渲染相应的元素。value1和value2是模板中的变量,它们可以是任何可以比较的类型(如数字、字符串等)。
Value 1 is equal to Value 2
Value 1 is not equal to Value 2
在这个例子中,th:if属性使用等号运算符(==)和不等号运算符(!=)来判断value1和value2是否相等或不相等。根据条件是否成立,相应的元素会被渲染。
Thymeleaf中并没有直接的“如果-则”语法结构,因为它通常使用th:if属性来实现条件渲染。不过,你可以在表达式内部使用Java的三元运算符的“如果-则”部分,但通常不会单独使用它,因为它需要与“否则”部分一起才完整。
在Thymeleaf中,你可以使用三元运算符来实现“如果-则-否则”的逻辑。下面是一个例子:
Default Text
在这个例子中,如果${condition}的值为true,则div元素的文本内容将是'Value if true';如果为false,则内容将是'Value if false'。
Thymeleaf中的?:操作符用于为null或空值提供默认值。如果变量的值为null或空字符串,它将使用默认值替代。以下是一个使用例子:
Original Text
${someValue}的值为null或空字符串,则div元素的文本内容将是'Default Value';否则,它将显示${someValue}的实际值。
下面是一个结合了条件渲染和默认值的Thymeleaf模板示例:
Thymeleaf Conditionals and Default Values
User Information
Name: User's Name
Email: User's Email
No user information available.
在这个例子中:
通过结合Thymeleaf的条件渲染和默认值操作符,你可以创建灵活且健壮的模板,能够处理各种数据情况并为用户提供清晰的信息。
在Thymeleaf中,下划线_是一个特殊的标记,表示无操作。当你在模板中的某个位置使用了_,Thymeleaf将不会对那个位置执行任何操作,即保持原样输出。这在某些情况下是很有用的,尤其是当你需要根据条件动态地包含或排除某些内容时。
下面是一个使用_无操作标记的Thymeleaf使用举例与说明:
假设你有一个用户列表,并且你想根据某个条件来决定是否显示某个用户的信息。你可以使用Thymeleaf的条件语句和_无操作标记来实现这一点。
Email
No Email
在上面的例子中,我们遍历了一个用户列表,并为每个用户显示名字和年龄。然后,我们根据user.showEmail的值来决定是否显示用户的电子邮件地址。如果user.showEmail为true,则显示电子邮件;如果为false,则使用th:text="_"来避免输出任何内容。这里_的作用是告诉Thymeleaf在该位置不进行任何操作,因此不会输出“No Email”这样的文本,而是保持空白。
需要注意的是,_无操作标记通常与Thymeleaf的条件语句(如th:if和th:unless)一起使用,以控制模板中某些部分的渲染行为。通过使用_,你可以更加精细地控制模板的输出内容,确保只输出你真正想要的内容。