Thymeleaf基础语法讲解【详解版】

简介: 该内容介绍了Thymeleaf模板引擎的一些基本表达式和语法。主要包括:1. 变量表达式 `${}` 和 `*{}`,用于获取对象属性,`*{}` 需先通过 `th:object` 指定对象。2. 链接表达式 `@{}`,用于构建应用路径并引入静态资源,但可能暴露版本号带来安全问题。3. 迭代循环使用 `th:each`,可获取状态变量如索引、序号、奇偶性等。4. 条件判断用 `th:if` 和 `th:unless`,基于不同类型的值进行逻辑判断。示例代码包括了遍历集合、设置表单输入值、条件渲染等场景。

变量表达式 ${}

使用方法:直接使用th:xx = "${}" 获取对象属性 。例如:articles是一个集合,集合中的元素就是一个对象,articles[0]表示集合中第一个对象

<div th:text="hello"></div><form id="articleForm"><input id="id" name="id" th:value="${articles[0].id}"/><input id="author" name="author" th:value="${articles[0].author}"/><input id="content" name="content" th:value="${articles[0].content}"/></form>

选择变量表达式 *{}

使用方法:首先通过th:object 获取对象,然后使用th:xx = "*{}"获取对象属性。显示效果和上面的例子是一样的。

<form id="articleForm" th:object="${articles[0]}"><input id="id" name="id" th:value="*{id}"/><input id="author" name="author" th:value="*{author}"/><input id="content" name="content" th:value="*{content}"/></form>

链接表达式 @{}

使用方法:通过链接表达式@{}直接拿到应用路径,然后拼接静态资源路径。例如:

<link rel="stylesheet" th:href="@{/webjars/bootstrap/css/bootstrap.min.css}"><script th:src="@{/webjars/jquery/jquery.min.js} "></script><script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>

html页面实际引入效果如下(这种方式会将webjars的版本号暴露出来,一定程度上造成安全问题,所以使用webjars就别用链接表达式):

其它表达式

在基础语法中,默认支持字符串连接、数学运算、布尔逻辑和三目运算等。例如:

<div th:text="${'I am '+(articles[0].author!=null?articles[0].author:'NoBody')}"></div>

当articles[0].author不为null的时候,显示:zimug,否则显示:NoBody

二、迭代循环

想要遍历List集合很简单,配合th:each 即可快速完成迭代。但是我们通常有一些需求,在集合的迭代过程还可以获取状态变量。状态变量可用于获取集合的下标/序号、总数、是否为单数/偶数行、是否为第一个/最后一个。例如:

<table class="table"><tr><td>下标</td><td>序号</td><td>作者</td><td>教程名称</td><td>内容</td></tr><tr th:each="item,stat : ${articles}" th:class="${stat.even}?'even':'odd'"><td th:text="${stat.index}"></td><td th:text="${stat.count}"></td><td th:text="${item.author}"></td><td th:text="${item.title}"></td><td th:text="${item.content}"></td></tr></table>

迭代下标变量用法:

状态变量定义在一个th:每个属性和包含以下数据:

   index:当前迭代索引,从0开始。这是索引属性。

   count:当前迭代序号,从1开始。这是序号属性。

   size:元素的总量迭代变量。这是大小属性。

   current:变量为每个迭代,当前正迭代的元素

   even/odd:是否当前迭代是奇数还是偶数,布尔属性。

   first:是否第一个当前迭代,布尔属性。

   last:是否最后一个当前迭代,布尔属性。

显示效果如下:

其中表格隔行换色,即奇数行换色,是通过stat.even实现的。为奇数行单独设置背景颜色

   <style type="text/css">.odd{

           background-color: #7d7d7d;}</style>

三、条件判断

条件判断通常用于动态页面的初始化,例如:

<div th:if="${articles}"><div>文章列表存在</div></div>

条件判断表达式可以是如下类型:

   boolean 类型并且值是 true, 返回 true

   数值类型并且值不是 0, 返回 true

   字符类型(Char)并且值不是 0, 返回 true

   String 类型并且值不是 "false", "off", "no", 返回 true

   不是 boolean, 数值, 字符, String 的其他类型, 返回 true

   对象值是 null, 返回 false

如果想取反则使用unless 例如:

<div th:unless="${articles}"><div>文章列表暂无.</div></div>


相关文章
|
6月前
|
容器
Thymeleaf $/*/#/@语法
Thymeleaf $/*/#/@语法
|
5天前
|
XML 前端开发 Java
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
68 0
|
5天前
|
前端开发 Java Linux
Thymeleaf - 语法使用详解
Thymeleaf - 语法使用详解
40 0
|
6月前
|
缓存
Thymeleaf参考手册
Thymeleaf参考手册
|
7月前
|
存储 JavaScript 前端开发
Thymeleaf入门教程
Thymeleaf入门教程
84 0
|
10月前
|
前端开发 Java
thymeleaf 入门篇(一),简单语法介绍
thymeleaf 入门篇,基本语法介绍
148 0
|
开发框架 前端开发 JavaScript
FreeMarker的基本语法
FreeMarker的基本语法
155 0
FreeMarker的基本语法
|
前端开发
Thymeleaf 语法学习
Thymeleaf 语法学习,要学习语法,还是参考官网文档最为准确,我们找到对应的版本看一下;
Thymeleaf 语法学习
|
XML Java 程序员
模板引擎:第一章:FreeMarker
模板引擎:第一章:FreeMarker
164 0
模板引擎:第一章:FreeMarker