Thymeleaf是个模板引擎,可以用于Web与非Web运用,它可以XML/XHTML/HTML5, JavaScript, CSS ,乃至文本文件。
Thymeleaf 的紧张目标是供应优雅的,高度可掩护性的View层模板,它既可以让前台设计职员查看页面的静态效果,也可以让后台职员在后台查看带数据的动态页面效果,从而降落前台设计职员和后台开拓职员的事情耦合,是团队协作更加和谐。
2. Thymeleaf 如何利用?
Thymeleaf 模板实在便是一个 后缀名为.html ,模板的内容有2部分组成,标准的html 标签 和 Thymeleaf 特有的属性。
首先我们须要创建我们的 Thymeleaf 模板,即后缀名为.html 文件,
<!DOCTYPE html>
<html xmlns:th=\公众http://www.thymeleaf.org\公众>
<head>
<title>Good Thymes Virtual Grocery</title>
<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>
2.1 设置 模板的 命名空间,z只有设置了该命名空间, IDE 才能够识别和利用 Thymeleaf 标签:
<html xmlns:th=\"大众http://www.thymeleaf.org\公众>
2.2 Thymeleaf 常用表达式:
变量表达式 : ${...} 用于访问容器高下文环境中的变量,例如: ${user.type}
选择表达式 :{} 类似于变量表达式,但是{} 针对的是当前选中的工具,例如:
<div th:object=\"大众${session.user}\"大众>
<p>Name: <span th:text=\公众{firstName}\"大众>Sebastian</span>.</p>
</div>
th:object 表示选中了一个工具,该表达式等同于:
<div>
<p>Name: <span th:text=\"大众${session.user.firstName}\"大众>Sebastian</span>.</p>
</div>
表达式:#{} 常日与th:text属性一起利用,指明声明了th:text的标签的文本是#{}中的key所对应的value
<p th:text=\公众#{home.welcome}\"大众>Welcome to our grocery store!</p>
该表达式中的 Key 例如:home.welcome 常日定义在 properties 中,该表达式常用来 实现国际化
超级链接表达式 : @{...} ,常用来表示路径
<script th:src=\"大众@{/resources/js/jquery/jquery.json-2.4.min.js}\"大众
片段表达式 : ~{...}
\公众~{templatename::selector}\公众包含在命名的模板上运用指定的标记选择器导致的片段templatename。请把稳,selector可以只是一个片段名称,
以是你可以指定~{templatename::fragmentname}像~{footer :: copy}上面那样大略的东西。
<div th:insert=\公众~{commons :: main}\"大众>...</div>
<div th:with=\"大众frag=~{footer :: #main/text()}\公众>
<p th:insert=\"大众${frag}\"大众>
</div>
字面
•文本笔墨:'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'))