当前位置：网站首页>Thymeleaf的相关知识
Thymeleaf的相关知识
2022-06-27 11:56:00 【瑾琳】
Thymeleaf 标准方言
一、如何识别标准方言
1.<span th:text="..."> 此种形式是比较常用的；不过需要在h5的标签里面引入p命名空间
例如：<html xmlns:th="http://www.thymeleaf.org">
<p th:text="#{home.welcome}">Welcome to our grocery store!</p>
text中的内容 最终会覆盖p标签的内容
2.<span data-th-text="..."> 此种形式 是h5 标准的一种形式；不需要引入p命名空间
3.变量表达式 ${......}
例如：
<span th:text="${book.author.name}"> 变量表达式存储的是变量
4.消息表达式 #{........} 也称为 文本外部化、国际化或i18n
例如：<table>
.....
<th th:text="#{header.address.city}">.....</th>
<th th:text="#{header.address.country}">....</th>
......
</table>
5.选择表达式：*{...} 也成为*表达式；与变量表达式的区别：他们是在当前选择的对象而不是整个上下文变量映射上执行
例如：
<div th:object="${book}" //取出book这个变量作为一个对象
.......
<span th:text="*{title}">....</span> // 取得是 book 的属性值
.......
</div>
6.链接表达式: @{...}
链接表达式可以是相对的，在这种情况下，应用程序上下文将不会作为URL的前缀：
<a th:href="@{../documents/report}">...</a>
也可以是服务器相对(同样，没有应用程序上下文前缀)：
<a th:href="@{~/contents/main}">....</a>
和协议相对(就像绝对URL，但浏览器将使用在显示的页面中使用的相同的HTTP或HTTPS协议):
<a th:href="@{//static.myconpany.com/res/initial}">...</a>
当然，link表达式也可以是绝对的：
<a th:href="@{http://www.myconpany.com/main}">....</a>
7.分段表达式： th:insert 或 th:replace
例如：
<!DOCTPYE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<div th:fragment="copy"> fragment 是片段的意思；把copy这个片段放到这里
© 2018<a href="https://waylau.com"> waylau.com</a>
</div>
</body>
</html>
copy片段的内容：
<body>
.......
<div th:insert="~{foot::copy}"
.......
</body>
8.字面量(文字)
文本：
例如：
<p>
Now you are looking at a <span th:text="working web application"> template file </span>
</p>
数字：
例如：
<p>
The year is <span th:text="2018"></span>
</p>
<p>
In two years,it will be <span th:text="2018+2"></span>
</p>
布尔：
<div th:if="${user.isAdmin()}==false"> .....
null:
<div th:if="${variable.something}==null">..........
9.算数操作 ：+ - * %
<div th:with="isEven=(${prodSta.cout}%2==0)">
10.比较和等价
比较：> < >= <=(gt lt ge le)
例如：
<ul class="pagination" data-th-if="${page.totalPages le 7}">
等价：
== != (eq ne)
例如：
<option data-th-each="i:$(#arrays.toIntegerArray({5,10,40,100}))" data-th-value="${i}" data-th-selected="${i eq page.size}" data-th-text="${i}"></option>
10.条件运算符
<tr th:class="${row.even}? 'even':'odd'">
.......
</tr>
11. 无操作
<span th:text="$(user.name)?:_" no user authenticated </span>
二、设置属性值
1.设置任意属性值 th:attr
例如：
<form action="subscribe.html" th:attr="[email protected]{/subscribe}">
<fieldset>
<input type="text" name="email"/>
<input type="submit" value="Subscrible!" th:attr="value=#{subscribe.submit}"/>
</fieldset>
</form>
最终的结果：
<form action="/gtvg/subscribe">
<fieldset>
<input type="text" name="email" />
<input type="submit" value="Subscrible"/>
</fieldset>
</form>
2.设置值到制定的属性
例如：
<form action="subscribe.html" th:attr="[email protected]{/subscribe}">
<fieldset>
<input type="text" name="email" />
<input type="submit" value="Subscrible!" th:attr="value=#{subscribe.submit}"/>
</fieldset>
</form>
换种方式写：
<form action="subscribe.html" th:action=“@{/subscribe}">
<fieldset>
<input type="text" name="email" />
<input type="submit" value="Subscrible!" th:value=”#{subscribe.submit}"/>
</fieldset>
</form>
3.固定值布尔属性 (比较多；用的时候查)
<input type="checkbox" name=“active” th:checked="${user.active}"/>
三、迭代器
1.基本的迭代 th:each
<li th:each="book:${books}" th:text="${book.title}">En las Oriallas del Sar</li>
2.状态变量
index ：当前变量的索引从0开始
count：当前变量的索引从1开始
size：迭代器的总数
current：当前迭代的变量
even：奇数
odd：偶数
first:迭代器的第一个对象
last:迭代器的最后一个
例如：
<table>
<tr>
<th>NAME</th>
<th>PRICE</th>
<th> IN STOCK</th>
</tr>
<tr th:each="prod,iterStat:${prods}" th:class="${iterStat.odd}?'odd'">
<td th:text="${prod.name}">Onions</td>
<td th:text="${prod.price}">2.41</td>
<td th:text="${prod.inStock}?#{true}:#{false}">yes</td>
</tr>
</table>
3.条件语句 th:if, th:unless ,switch
例如：
th:if
<a href="comments.html" th:href="@{/product/comments(prodId=${prod.id})}"
th:if="${not #lists.isEmpty(prod.comments)}">view</a>
th:unless
<a href="comments.html" th:href="@{/product/comments(prodId=${prod.id})}"
th:unless="${#lists.isEmpty(prod.comments)}">view</a>
<div th:switch="${user.role}">
<p th:case="'admin'">User is an administrator </p>
<p th:case="'#{roles.manager}'">User is an manager </p>
<p th:case="'*'">User is some other things </p>
</div>
四、模板布局 ：公用的部分提取出来
1.定义和引用片段
定义片段：
<!DOCTPYE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<div th:fragment="copy">
© 2018<a href="https://waylau.com">waylau.com</a>
</div>
</body>
<html>
引用片段：
<body>
......
<div th:insert="~{footer::copy}"></div>
<body>
不使用 th:fragment
定义片段：
....
<div id="copy-section">
©2017 <a href="https://waylau.com">waylau.com</a>
</div>
引用片段：
<body>
......
<div th:insert="~{footer::#copy-section"></div>
<body>
2.th:insert,th:replace,th:include 三者区别
相同：三者都可以引用模板片段
不同：
th:insert 他将简单地插入制定的片段作为正文的主标签
th:replace 用制定实际片段来替换其主标签
th：include 类似于 th：insert，但不是插入片段，他只插入此片段的内容()
例如：
定义一个片段:
<footer th:fragment="copy">
©2018<a href="https://waylau.com">waylau.com</a>
<footer>
引用片段：
<body>
.....
<div th:insert="footer::copy"></div>
<div th:replace="footer::copy"></div>
<div th:include="footer::copy"></div>
</body>
最终的结果：
<body>
.....
<div>
<footer>
©2018<a href="https://waylau.com">waylau.com</a>
<footer>
</div>
<footer>
©2018<a href="https://waylau.com">waylau.com</a>
<footer>
<div>
©2018<a href="https://waylau.com">waylau.com</a>
</div>
</body>
五：属性优先级
当在同一个标签中写入多个th:* 属性时，会发生什么？
<ul>
<li th:each="item:${items} th:text=${item..description}"> Item description here....</li>
</ul>
结论：each的优先级高于text的优先级
六、注释
1.标准HTML/XML 注释
例如：
<!-- User info follows-->
<div th:text="${....}"
....
<div>
2.Thymeleaf解析器级别注释块
删除<!-- /*和*/-->之间的所有内容
<!-- /*-->
<div>
you can see me only before Thymeleaf processes me!
</div>
<!-- */-->
3.原型注释块：
当模板静态打开时(比如原型设计)，原型注释块所注释的代码将被注释，而在模板执行时，这些注释的代码，就能被显示出来
例如：
模板静态打开:
<span>hello!</span>
<!-- /*/-->
<div th:text="${...}">
....
</div>
<!-- /*/-->
<span>goodbye!</span>
模板执行时：
<span>hello!</span>
<div th:text="${...}">
....
</div>
<span>goodbye!</span>
七、内联
1.内联表达式：
[[...]]或[(...)]分别对应于th:text(会对特殊字符进行转义)和th:utext(不会对特殊字符进行转义)
定义：
<p> The message is "[(${msg})]"</p>
结果：
<p> The message is "This is <b> great！</b>"</p>
定义：
<p> The message is "[[${msg}]]"</p>
结果：
<p> The message is "This is <b> great！</b>"</p>
2.禁用内联
有时需要禁用这种机制，比如，想输出[[...]]或[(...)]文本内容 th:inline="none"
<p th:inline="none" >A double array looks like this:[[1,2,3]],[[4,5]]!</p>
这样就禁用了内联
3.javaScript内联
定义：
<script th:inline="javascript">
....
var username=/*[[${session.user.name}]]*/ "Gertrud Kiwifruit";
...
</script>
结果：
<script th:inline="javascript">
....
var username= "Sebastian \"Fruit\" Applejuice";
...
</script>
4.css内联
定义：
classname='main elems'
align='center'
<style th:inline="css"
.[[${classname}]]{
text-align:[[${align}]];
}
结果：
<style th:inline="css"
.main\ elems{
text-align:cnter
}
八、表达式基本对象
Thymeleaf模板初始化的时候有些对象和变量的映射始终可以被访问，
换句话说，在Thymeleaf模板被初始化的时候这些变量和对象已经被初始化好了
1.#ctx:上下文对象。是org.thymeleaf.context.lContext或者org.thmeleaf.context.lWebContext的实现
2.#locale:直接访问与java.util.Locale关联的当前的请求
例如：
${#ctx.locale}
${#ctx.variableNames}
${#ctx.request}
${#ctx.response}
${#ctx.session}
${#ctx.servletContext}
${#locale}
3.request/session等属性
param：用于检索请求参数
session:用于检索session属性
application:用于检索application/servlet上下文属性
部分api:
${param.foo}
${param.size()}
${param.isEmpty()}
${param.containsKey('foo')}
${session.foo}
${session.size()}
${session.isEmpty()}
${session.containsKey('foo')}
${application.foo}
${application.size()}
${application.isEmpty()}
${application.containsKey('foo')}
4.Web上下文对象
#request:直接访问与当前请求关联的 javax.servlet.http.HttpServletRequest对象
#session:直接访问与当前请求关联的javax.servlet.http.HttpSession对象
#servletContext:直接访问与当前请求关联的javax.servlet.ServletContext对象
一些常见的api:
${#request.getAttribute('foo')}
${#request.getParameter('foo')}
${#request.getContextPath()}
${#request.getRequestName()}
...
${#session.getAttribute('foo')}
${#session.id}
${#session.lastAccessedTime()}
...
${#servletContext.getAttribute('foo')}
${#servletContext.contextPath}
...
九、Thymeleaf与Spring Boot集成
1.配置环境
Thymeleaf3.0.3.RELEASE
Thymeleaf Layout Dialect 2.2.0
2.修改build.gradle
边栏推荐
- $15.8 billion! 2021 the world's top15 most profitable hedge fund giant
- Nvme2.0 protocol - new features
- Drive to APasS！ Use Mingdao cloud to manage F1 events
- MapReduce原理剖析（深入源码）
- 深入理解 happens-before 原则
- mysql学习1：安装mysql
- In 2021, the global carbon graphite brush revenue is about US $2366million, and it is expected to reach US $2701.8 million in 2028
- 【TcaplusDB知识库】TcaplusDB-tcapsvrmgr工具介绍（二）
- 关于枚举类的两种用法
- 剑指 Offer 04. 二维数组中的查找
猜你喜欢
In 2021, the global enhanced oil production surfactant revenue was about USD 202.3 million, and it is expected to reach USD 297.1 million in 2028
![[tcapulusdb knowledge base] Introduction to tcapulusdb tcapsvrmgr tool (II)](/img/ce/b58e436e739a96b3ba6d2d33cf8675.png)
[tcapulusdb knowledge base] Introduction to tcapulusdb tcapsvrmgr tool (II)
Operators are also important if you want to learn the C language well
AI for Science：科研范式、开源平台和产业形态
MySQL high level statements (I)
微服务拆分
干货！零售业智能化管理会遇到哪些问题？看懂这篇文章就够了
Wechat applet realizes five-star evaluation
树莓派 3b+ 学习
Mathematical knowledge -- ideas and examples of game theory (bash game, Nim game, wizov game)
随机推荐
秒云荣获《2022爱分析 · IT运维厂商全景报告》智能运维AIOps市场代表厂商
esp32s3 IPERF例程测试 esp32s3吞吐量测试
MapReduce principle analysis (in-depth source code)
巅峰小店APP仿站开发玩法模式讲解源码分享
微服务拆分
c/s 架构
解开C语言的秘密《关键字》(第六期)
Histrix工作原理
FileOutputStream
Peak store app imitation station development play mode explanation source code sharing
How to participate in openharmony code contribution
R语言使用glm函数构建泊松对数线性回归模型处理三维列联表数据构建饱和模型、使用step函数基于AIC指标实现逐步回归筛选最佳模型、解读分析模型
R语言dplyr包arrange函数排序dataframe数据、通过多个数据列排序dataframe数据、指定第一个字段降序排序，第二字段不指定（默认升序排序）
build.gradle 配置
面试突击60：什么情况会导致 MySQL 索引失效？
The R language uses the DOTPLOT function of epidisplay package to visualize the frequency of data points in different intervals in the form of point graph, specifies the grouping parameters with the b
动态规划【四】（计数类dp）例题：整数划分
盘点一些好用且小众的 Markdown 编辑器
Detailed explanation of interprocess communication
Research Report on the overall scale, major producers, major regions, products and application segments of swine vaccine in the global market in 2022