HTML5模板引擎Thymeleaf教程
Thymeleaf是⼀个XML/XHTML/HTML5模板引擎,可⽤于Web与⾮Web环境中的应⽤开发。它是⼀个开源的Java库,基于Apache License 2.0许可,由Daniel Fernández创建,该作者还是Java加密库Jasypt的作者。
Thymeleaf提供了⼀个⽤于整合Spring MVC的可选模块,在应⽤开发中,你可以使⽤Thymeleaf来完全代替JSP,或其他模板引擎,如Velocity、FreeMarker等。Thymeleaf的主要⽬标在于提供⼀种可被浏览器正确显⽰的、格式良好的模板创建⽅式,因此也可以⽤作静态建模。你可以使⽤它创建经过验证的XML与HTML模板。相对于编写逻辑或代码,开发者只需将标签属性添加到模板中即可。接下来,这些标签属性就会在DOM(⽂档对象模型)上执⾏预先制定好的逻辑。
⽰例模板:
<table>
<thead>
<tr>
<th th:text="#{msgs.headers.name}">Name</td>
<th th:text="#{msgs.headers.price}">Price</td>
</tr>
</thead>
<tbody>
<tr th:each="prod : ${allProducts}">
<td th:text="${prod.name}">Oranges</td>
<td th:text="${#numbers.formatDecimal(prod.price,1,2)}">0.99</td>
</tr>
</tbody>
</table>
这段介绍下⾯的实例模板稍后我会逐⼀解释
使⽤步骤
第⼀步往 html页⾯加⼊头⽂件相应的schema 就是这个⽹址
<!DOCTYPE html>
<html xmlns="/1999/xhtml"
xmlns:th="">
第⼆步就是你的原始模板
<table class="box-table-a">
<caption>thyMeleaf使⽤教程</caption>
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">这是标题1</th>
<th scope="col">这是标题2</th>
<th scope="col">这是标题3</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>朱遇平</td>
<td>java</td>
<td>程序猿</td>
</tr>
<tr>
<td>2</td>
<td>张三</td>
<td>php</td>
<td>程序猿</td>
</tr>
<tr>
<td>3</td>
<td>李四</td>
<td>c++</td>
<td>程序猿</td>
</tr>
</tbody>
</table>
第三部就是怎么采⽤ThyMeleaf标签替换这些了⽽不⽤改动模板以及样式 thyMeleaf 是⼀个基于标签⾃定义属性实现的⼀个模板引擎,这⾥怎么配置Thymeleaf先不说到后⾯再说,先说说他的标签⽤法
这⾥我想详细的讲下讲完了我就把上⾯的模型改成修改后的
# 代表获取对象从 messages bundle 也就是消息的资源本地化⽂件
$ 表⽰从model⾥⾯获取
# $这2个可以⼀起⽤⽐如#{'system.'+${model.id}}  -----这相当于 #{system.01}的资源本地化⽂件中的system.01内容
下⾯介绍常⽤的标签
th:fragment=“public” 相当于 include标签
th:each="user : ${users}" 相当于c:foreach  使⽤时候
如上⾯
<tr th:each="user : ${users}">
<td th:text="${user.id}">01</td>
<td th:text="${user.name}">朱遇平</td>
<td th:text="${}">java</td>
<td th:text="${}">程序员</td>
</tr>
这些静态数据不要管他当运⾏时候⾃动替换
上⾯注意到th:text="${user.id}" 这是代表着运⾏时候动态设置标签为⽤户的id属性的值
th:href="@{/users/delete(id=${u.id})}">
这是动态设置url属性参考上⾯的⽂章总结
在表单的环境下有时候我们可能需要动态数据绑定
OK thymeleaf 也有相关标签
⾸先了解的是
<form action="#" th:action="@{/users/add}" th:object="${myuser}" method="post">
这⾥th:Object表⽰表单与改myuser注⼊的实体映射,
在表单 th:field="*{id} 则表⽰该表单的值与 myuser的id绑定
这⾥注意到我上⾯的遍历表格只改了⼀个其他的三个你不是说可以不⽤改模板的的那该怎么办啊
th:remove="all"  使⽤了该标签将在运⾏时候移除所有的元素
<tr th:remove="all">
</tr>
上⾯的其他⼏⾏就直接相当于忽略他了
趁着中午的时间更新下。这⾥先讲到这⾥了有时间补充更新它的配置以及 spring整合
有⼈问我该怎么呢使⽤if 突然想到我上⾯好像忘了讲这个
经常有由td 表格展⽰某⼀⾏要判断的情况
<td class="status" th:if="${#strings.isEmpty(status)}" th:text="这状态为空">这⾥显⽰状态不为空</td>同理
${not #strings.isEmpty(status)}
换p标签只要把td改成p标签即可
这⾥要提⼀下strings哪⾥来的上⾯我们引⽤的那篇博⽂上的⼀段话
表达式基本对象:
#ctx:context object
#root或者#vars
#locale
#httpServletRequest
#httpSession
表达式功能对象:
#dates:java.util.Date的功能⽅法类。
#calendars:类似#dates,⾯向java.util.Calendar
#numbers:格式化数字的功能⽅法类。
#strings:字符串对象的功能类,contains,startWiths,prepending/appending等等。
#objects:对objects的功能类操作。政府html5模板
#bools:对布尔值求值的功能⽅法。
#arrays:对数组的功能类⽅法。
#lists:对lists功能类⽅法
#sets
#maps
#aggregates:对数组或者集合创建聚合的功能⽅法,
th:text="${#aggregates.derLines.{purchasePrice * amount})}"
#messages:在变量表达式中获取外部信息的功能类⽅法。
#ids:处理可能重复的id属性的功能类⽅法。
看到strings了没

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。