自从来公司后都没用过jsp当界面渲染了,因为前后端分离不是很好,反而模板引擎用的比较多,thymeleaf最大的优势后缀为html,就是只需要浏览器就可以展现页面了,还有就是thymeleaf可以很好的和spring集成.下面开始学习.

1.引入依赖

maven中直接引入

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

可以查看依赖关系,发现spring-boot-starter-thymeleaf下面已经包括了spring-boot-starter-web,所以可以把spring-boot-starter-web的依赖去掉.

2.配置视图解析器

spring-boot很多配置都有默认配置,比如默认页面映射路径为 
classpath:/templates/*.html 
同样静态文件路径为 
classpath:/static/

在application.properties中可以配置thymeleaf模板解析器属性.就像使用springMVC的JSP解析器配置一样

#thymeleaf start
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-
spring.thymeleaf.content-type=text/html
#开发时关闭缓存,不然没法看到实时页面
spring.thymeleaf.cache=false
#thymeleaf end

具体可以配置的参数可以查看 
org.springframework.boot.autoconfigure.thymeleaf.ThymeleafProperties这个类,上面的配置实际上就是注入到该类中的属性值.

3.编写DEMO

1.控制器

 @Controller
public class HelloController { private Logger logger = LoggerFactory.getLogger(HelloController.class);
/**
* 测试hello
* @return
*/
@RequestMapping(value = "/hello",method = RequestMethod.GET)
public String hello(Model model) {
model.addAttribute("name", "Dear");
return "hello";
} }

2.view(注释为IDEA生成的索引,便于IDEA补全)

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>hello</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<!--/*@thymesVar id="name" type="java.lang.String"*/-->
<p th:text="'Hello!, ' + ${name} + '!'" ></p>
</body>
</html>

3.效果

4.基础语法

回味上面的DEMO,可以看出来首先要在改写html标签

<html xmlns:th="http://www.thymeleaf.org">

这样的话才可以在其他标签里面使用th:*这样的语法.这是下面语法的前提.

1.获取变量值

<p th:text="'Hello!, ' + ${name} + '!'" ></p>

可以看出获取变量值用$符号,对于javaBean的话使用变量名.属性名方式获取,这点和EL表达式一样.

另外$表达式只能写在th标签内部,不然不会生效,上面例子就是使用th:text标签的值替换p标签里面的值,至于p里面的原有的值只是为了给前端开发时做展示用的.这样的话很好的做到了前后端分离.

2.引入URL

Thymeleaf对于URL的处理是通过语法@{…}来处理的

<a th:href="@{http://blog.csdn.net/u012706811}">绝对路径</a>
<a th:href="@{/}">相对路径</a>
<a th:href="@{css/bootstrap.min.css}">Content路径,默认访问static下的css文件夹</a>

类似的标签有:th:hrefth:src

3.字符串替换

很多时候可能我们只需要对一大段文字中的某一处地方进行替换,可以通过字符串拼接操作完成:

<span th:text="'Welcome to our application, ' + ${user.name} + '!'">

一种更简洁的方式是:

<span th:text="|Welcome to our application, ${user.name}!|">

当然这种形式限制比较多,|…|中只能包含变量表达式${…},不能包含其他常量、条件表达式等。

4.运算符

在表达式中可以使用各类算术运算符,例如+, -, *, /, %

th:with="isEven=(${prodStat.count} % 2 == 0)"

逻辑运算符>, <, <=,>=,==,!=都可以使用,唯一需要注意的是使用<,>时需要用它的HTML转义符

 th:if="${prodStat.count} &gt; 1"
th:text="'Execution mode is ' + ( (${execMode} == 'dev')? 'Development' : 'Production')"

5.条件

if/unless

Thymeleaf中使用th:if和th:unless属性进行条件判断,下面的例子中,标签只有在th:if中条件成立时才显示:

<a th:href="@{/login}" th:unless=${session.user != null}>Login</a>

th:unless于th:if恰好相反,只有表达式中的条件不成立,才会显示其内容。

Switch

Thymeleaf同样支持多路选择Switch结构:

<div th:switch="${user.role}"> <p th:case="'admin'">User is an administrator</p> <p th:case="#{roles.manager}">User is a manager</p> </div>

<div th:switch="${user.role}">
<p th:case="'admin'">User is an administrator</p>
<p th:case="#{roles.manager}">User is a manager</p>
</div>

默认属性default可以用*表示:

div th:switch="${user.role}">
<p th:case="'admin'">User is an administrator</p>
<p th:case="#{roles.manager}">User is a manager</p>
<p th:case="*">User is some other thing</p>
</div>

6.循环

渲染列表数据是一种非常常见的场景,例如现在有n条记录需要渲染成一个表格

,该数据集合必须是可以遍历的,使用th:each标签:

<body>
<h1>Product list</h1> <table>
<tr>
<th>NAME</th>
<th>PRICE</th>
<th>IN STOCK</th>
</tr>
<tr th:each="prod : ${prods}">
<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> <p>
<a href="../home.html" th:href="@{/}">Return to home</a>
</p>
</body>

可以看到,需要在被循环渲染的元素(这里是)中加入th:each标签,其中th:each=”prod : ${prods}”意味着对集合变量prods进行遍历,循环变量是prod在循环体中可以通过表达式访问。

7.Utilities

为了模板更加易用,Thymeleaf还提供了一系列Utility对象(内置于Context中),可以通过#直接访问:

  • #dates
  • #calendars
  • #numbers
  • #strings
  • arrays
  • lists
  • sets
  • maps
  • … 
    下面用一段代码来举例一些常用的方法:

date

/*
* Format date with the specified pattern
* Also works with arrays, lists or sets
*/
${#dates.format(date, 'dd/MMM/yyyy HH:mm')}
${#dates.arrayFormat(datesArray, 'dd/MMM/yyyy HH:mm')}
${#dates.listFormat(datesList, 'dd/MMM/yyyy HH:mm')}
${#dates.setFormat(datesSet, 'dd/MMM/yyyy HH:mm')} /*
* Create a date (java.util.Date) object for the current date and time
*/
${#dates.createNow()} /*
* Create a date (java.util.Date) object for the current date (time set to 00:00)
*/
${#dates.createToday()}

string

/*
* Check whether a String is empty (or null). Performs a trim() operation before check
* Also works with arrays, lists or sets
*/
${#strings.isEmpty(name)}
${#strings.arrayIsEmpty(nameArr)}
${#strings.listIsEmpty(nameList)}
${#strings.setIsEmpty(nameSet)} /*
* Check whether a String starts or ends with a fragment
* Also works with arrays, lists or sets
*/
${#strings.startsWith(name,'Don')} // also array*, list* and set*
${#strings.endsWith(name,endingFragment)} // also array*, list* and set* /*
* Compute length
* Also works with arrays, lists or sets
*/
${#strings.length(str)} /*
* Null-safe comparison and concatenation
*/
${#strings.equals(str)}
${#strings.equalsIgnoreCase(str)}
${#strings.concat(str)}
${#strings.concatReplaceNulls(str)} /*
* Random
*/
${#strings.randomAlphanumeric(count)}

快速的学习还是直接写例子最快,后期写Demo遇到问题再加上去

参考链接: http://www.tianmaying.com/tutorial/using-thymeleaf

整合项目地址:

https://github.com/nl101531/JavaWEB

补充

在spring-boot1.4之后,支持thymeleaf3,可以更改版本号来进行修改支持. 
3相比2极大的提高了效率,并且不需要标签闭合,类似的link,img等都有了很好的支持,按照如下配置即可

<properties>
<project.build.sourceEncoding>UTF-</project.build.sourceEncoding>
<!-- set thymeleaf version -->
<thymeleaf.version>3.0..RELEASE</thymeleaf.version>
<thymeleaf-layout-dialect.version>2.0.</thymeleaf-layout-dialect.version>
<!--set java version-->
<java.version>1.8</java.version>
</properties>

Spring Boot学习记录(二)–thymeleaf模板的更多相关文章

  1. Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客

    ==他的博客应该不错,没有细看 Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客 http://blog.csdn.net/u012706811/article/det ...

  2. 我的Spring Boot学习记录(二):Tomcat Server以及Spring MVC的上下文问题

    Spring Boot版本: 2.0.0.RELEASE 这里需要引入依赖 spring-boot-starter-web 这里有可能有个人的误解,请抱着怀疑态度看. 建议: 感觉自己也会被绕晕,所以 ...

  3. Spring Boot 2.0 整合Thymeleaf 模板引擎

    本节将和大家一起实战Spring Boot 2.0 和thymeleaf 模板引擎 1. 创建项目 2. 使用Spring Initlizr 快速创建Spring Boot 应用程序 3. 填写项目配 ...

  4. 【Spring Boot学习之二】WEB开发

    环境 Java1.8 Spring Boot 1.3.2 一.静态资源访问 动静分离:动态服务和前台页面图片分开,静态资源可以使用CDN加速;Spring Boot默认提供静态资源目录位置需置于cla ...

  5. 【转载】Spring boot学习记录(二)-配置文件解析

    前言:本系列文章非本人原创,转自:http://tengj.top/2017/04/24/springboot0/ 正文 Spring Boot使用了一个全局的配置文件application.prop ...

  6. spring boot 学习笔记(二) 构建web支持jsp

    一.必须将项目打包成war包 <packaging>war</packaging> 二.pom.xml加入依赖包 <dependency> <groupId& ...

  7. Spring Boot 学习笔记--整合Thymeleaf

    1.新建Spring Boot项目 添加spring-boot-starter-thymeleaf依赖 <dependency> <groupId>org.springfram ...

  8. 【转载】Spring boot学习记录(一)-入门篇

    前言:本系列文章非本人原创,转自:http://tengj.top/2017/04/24/springboot0/ 正文 首先声明,Spring Boot不是一门新技术.从本质上来说,Spring B ...

  9. spring boot用ModelAndView向Thymeleaf模板传参数

    最近在调试一个Spring Boot向Thymeleaf模板传参数的例子,但踩了很多坑,这里就把详细过程记录下来,以供大家参考. 先说下,这里遇到哪些坑呢? 1 我用的是IDEA社区版,这不支持JSP ...

随机推荐

  1. 【BZOJ 4361】 4361: isn (DP+树状数组+容斥)

    4361: isn Time Limit: 10 Sec  Memory Limit: 256 MBSubmit: 218  Solved: 126 Description 给出一个长度为n的序列A( ...

  2. 【BZOJ 2665】 2665: [cqoi2012]编号(暴力?)

    2665: [cqoi2012]编号 Time Limit: 3 Sec  Memory Limit: 128 MBSubmit: 347  Solved: 217 Description 你需要给一 ...

  3. 【BZOJ 4305】 4305: 数列的GCD (数论)

    4305: 数列的GCD Description 给出一个长度为N的数列{a[n]},1<=a[i]<=M(1<=i<=N).  现在问题是,对于1到M的每个整数d,有多少个不 ...

  4. EventBus机制 handler 区别

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha 事件巴士 是 采用 观察者模式 实现 事件订阅总线, 可以用在 应用程序中, 组件之间, ...

  5. 压测工具Siege

    一.下载 http://www.joedog.org/ http://www.joedog.org/pub/siege/siege-2.70.tar.gz 二.测试 siege -c200 -r10 ...

  6. fpdf中文乱码,添加字符集

    中文乱码 引入Olivier的chinese.php(点击下载) 支持中文,其中有Big5,GB两种 使用方法也很简单 $pdf->AddBig5Font(); $pdf->SetFont ...

  7. hihocoder1322 树结构判定(161周)

    hihocoder1322 : 树结构判定(161周) 题目链接 思路: 无向图中判断是不是一棵树. 并查集判断.判断是不是只有一个连通分量.并且该联通分量中没有环.没有环的判定很简单就是看边的数目和 ...

  8. Django 中文显示

    Django中文显示: 1.如要在.py文件中显示中文,在文件首行加上:# -*- coding: utf-8 -*- 2.如要在html文件中显示中文,要将文件保存为UTF-8格式 3.在setti ...

  9. 反激 (Flyback) 控制器 -- LTC3803

    LTC3803 - 采用 ThinSOT 封装的恒定频率.电流模式.反激式 DC/DC 控制器 特点 VIN 和 VOUT 仅受限于外部元件 可调斜率补偿 内部软起动 200kHz 恒定频率操作 ±1 ...

  10. How to create functions that can accept variable number of parameters such as Format

    http://www.chami.com/tips/delphi/112696D.html Sometimes it's necessary to pass undefined number of [ ...