p
r
o
d
S
t
a
t
.
c
o
u
n
t
{prodStat.count}%2 == 0" th:text="
</span><span class="katex-html"><span class="base"><span class="strut" style="height: 0.8889em; vertical-align: -0.1944em;"></span><span class="mord"><span class="mord mathnormal">p</span><span class="mord mathnormal">ro</span><span class="mord mathnormal">d</span><span class="mord mathnormal">St</span><span class="mord mathnormal">a</span><span class="mord mathnormal">t</span><span class="mord">.</span><span class="mord mathnormal">co</span><span class="mord mathnormal">u</span><span class="mord mathnormal">n</span><span class="mord mathnormal">t</span></span></span></span></span></span>{isEvens}”>< /div></td></tr><tr><td>th:style</td><td>设置样式</td><td>< div th:style=“‘color:#F00; font-weight:bold’”>< /div></td></tr><tr><td>th:onclick</td><td>点击事件</td><td>< td th:onclick = “‘getInfo()’”>< /td></td></tr><tr><td>th:each</td><td>遍历,支持 Iterable、Map、数组等。</td><td>< table> <br> < tr th:each=“m:<span class="katex--inline"><span class="katex"><span class="katex-mathml">
s
e
s
s
i
o
n
.
m
a
p
"
>
<
b
r
/
>
<
t
d
t
h
:
t
e
x
t
=
"
{session.map}"> <br /> < td th:text="
</span><span class="katex-html"><span class="base"><span class="strut" style="height: 0.8889em; vertical-align: -0.1944em;"></span><span class="mord"><span class="mord mathnormal">sess</span><span class="mord mathnormal">i</span><span class="mord mathnormal">o</span><span class="mord mathnormal">n</span><span class="mord">.</span><span class="mord mathnormal">ma</span><span class="mord mathnormal">p</span></span><span class="mord">"</span><span class="mspace" style="margin-right: 0.2778em;"></span><span class="mrel">><</span><span class="mspace" style="margin-right: 0.2778em;"></span></span><span class="base"><span class="strut" style="height: 1em; vertical-align: -0.25em;"></span><span class="mord mathnormal">b</span><span class="mord mathnormal" style="margin-right: 0.0278em;">r</span><span class="mord">/</span><span class="mspace" style="margin-right: 0.2778em;"></span><span class="mrel">><</span><span class="mspace" style="margin-right: 0.2778em;"></span></span><span class="base"><span class="strut" style="height: 0.6944em;"></span><span class="mord mathnormal">t</span><span class="mord mathnormal">d</span><span class="mord mathnormal">t</span><span class="mord mathnormal">h</span><span class="mspace" style="margin-right: 0.2778em;"></span><span class="mrel">:</span><span class="mspace" style="margin-right: 0.2778em;"></span></span><span class="base"><span class="strut" style="height: 0.6151em;"></span><span class="mord mathnormal">t</span><span class="mord mathnormal">e</span><span class="mord mathnormal">x</span><span class="mord mathnormal">t</span><span class="mspace" style="margin-right: 0.2778em;"></span><span class="mrel">=</span><span class="mspace" style="margin-right: 0.2778em;"></span></span><span class="base"><span class="strut" style="height: 0.6944em;"></span><span class="mord">"</span></span></span></span></span>{m.getKey()}”>< /td> <br> < td th:text=“${m.getValue()}”>< /td><br> < /tr> <br>< /table></td></tr><tr><td>th:if</td><td>根据条件判断是否需要展示此标签</td><td>< a th:if =“${userId == collect.userId}”></td></tr><tr><td>th:unless</td><td>和 th:if 判断相反,满足条件时不显示</td><td>< div th:unless=“${m.getKey()==‘name’}” >< /div></td></tr><tr><td>th:switch</td><td>与 Java 的 switch case语句类似 通常与 th:case 配合使用</td><td>< div th:switch=“${name}”> <br> < span th:case=“值1”>< /span> <br> < span th:case=“值2”>< /span><br></ div></td></tr><tr><td>th:selected</td><td>select 选择框选中</td><td>< select> <br> < option th:selected=“${name==‘a’}”> < /option> <br> …… <br>< /select></td></tr><tr><td>th:src</td><td>替换 HTML 中的 src 属性</td><td>< img th:src=“@{}” src=“” /></td></tr><tr><td>th:action</td><td>替换表单提交地址</td><td>< form th:action=“@{/user/login}” th:method=“post”> < /form></td></tr><tr><td>th:inline</td><td>内联属性; 该属性有 text、none、javascript 三种取值。 在 < script> 标签中使用时,js 代码中可以获取到后台传递页面的对象。</td><td></td></tr><tr><td>th:replace</td><td>布局标签; 使用 th:fragment 属性指定的模板片段(包含标签)替换当前整个标签。</td><td></td></tr><tr><td>th:insert</td><td>布局标签; 将使用 th:fragment 属性指定的模板片段(包含标签)插入到当前标签中。</td><td></td></tr><tr><td>th:fragment</td><td>模板布局,类似 JSP 的 tag,用来定义一段被引用或包含的模板片段</td><td></td></tr></tbody></table>
表达式:
变量表达式: ${}使用 ${} 包裹的表达式就是变量表达式
获取对象的属性和方法:controller发送了一个student对象
获取学生的id:${student.getId}
1
使用内置的基本对象
#ctx :上下文对象
#vars :上下文变量
#locale:上下文的语言环境
#request:Web 应用中可用(服务端:setAttribute(“student”,student))
${request.getAttribute('student')}
1
#response:Web 应用中可用
#session:Web 应用中可用
#servletContext:Web 应用中可用
使用内置的工具对象
strings、numbers、arrays、集合类、dates日期等等
${#strings.equals(o1,o2}
1
选择变量表达式: *{}(与变量表达式功能基本一致,但可以配合th:object 使用,th:object 存储一个对象后,在其内部子标签内可以获取该对象)
国际化: #{}(可以获取国际化的配置)
链接 URL 表达式: 引用其他连接(静态资源、form 表单的请求、a标签等等等等)
无参请求:@{xxx}
有参请求:@{/xxx(k1=v1,k2=v2)}
片段表达式:~(用于在模板页面中引用其他的模板片段)
文字
文本字面量:'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)
3、使用
Spring Boot 推荐使用 Thymeleaf 作为其模板引擎。SpringBoot 为 Thymeleaf 提供了一系列默认配置,项目中一但导入了 Thymeleaf 的依赖,相对应的自动配置 (ThymeleafAutoConfiguration 或 FreeMarkerAutoConfiguration) 就会自动生效,因此 Thymeleaf 可以与 Spring Boot 完美整合 。
Spring Boot 整合 Thymeleaf 模板引擎,需要以下步骤:
引入 Starter启动器
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
1
2
3
4
5
其模板引擎大多都使用默认值,不配置也能直接使用
image-20220920165656447
通过controller访问
image-20210825115440665 image-20210825115459154 image-20210825115512450
2.7.2、Freemarker
一种基于模板和要改变的数据, 并用来生成输出文本(HTML网页,电子邮件,配置文件,源代码等)的通用工具。 是一种用Java语言编写的模板引擎,与Web容器无关,在Web运行时,它并不知道Servlet或HTTP。它不仅可以用作表现层的实现技术,而且还可以用于生产XML,JSP或Java等。目前企业中主要用Freemarker做静态页面或是页面展示
freemarker并不关心数据的来源,只是根据模板的内容,将数据模型在模板中显示并输出文件
添加Freemarker 的依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
1
2
3
4
yml中配置
spring:
freemarker:
cache: false
charset: utf-8
template-loader-path: classpath:/templates/
suffix: .html
content-type: text/html
request-context-attribute: request
1
2
3
4
5
6
7
8
html页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>FreeMarker</title>
</head>
<body>
<h1>Welcome ${user} !</h1>
<u1>
<#list lists as list>
<li>${list} </li>
</#list>
</u1>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2.7.3、整合JSP
SpringBoot默认是不支持JSP模板引擎的,但是可以通过引入相关依赖来整合JSP模板引擎。
导入支持JSP的依赖
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
</dependency>
1
2
3
4
5
6
7
8
9
10
添加webapp文件
image-20210908155559672
yml文件中配置支持jsp页面
spring:
mvc: #支持的jsp路径
view:
prefix: /WEB-INF/
suffix: .jsp