Thymeleaf是一个流行的模板引擎,该模板引擎采用Java语言开发模板引擎是一个技术名词,是跨领域跨平台的概念,在Java语言体系下有模板引擎,在C#、PHP语言体系下也有模板引擎,甚至在 Javascript中也会用到模板引擎技术,Java生态下的模板引擎有 Thymeleaf、 Freemaker、Ⅴ elocity、 Beetl(国产)等。
Thymeleaf对网络环境不存在严格的要求,既能用于web环境下,也能用于非web环境下。在非web环境下,他能直接显示模板上的静态数据;在web环境下,它能像Jsp一样从后台接收数据并替换掉模板上的静态数据。它是基于HTML的,以HIML标签为载体,Thymeleaf要寄托在HTML标签下实现。
Spring Boot集成了 Thymeleaf模板技术,并且 Spring boot官方也推荐使用 Thymeleaf来替代JSP技术, Thymeleaf是另外的一种模板技术,它本身并不属于 Spring Boot, Spring Boot只是很好地集成这种模板技术,作为前端页面的数据展示,在过去的 Java Web开发中,我们往往会选择使用Jsp去完成页面的动态渲染,但是jsp需要翻译编译运行,效率低
官网https://www.thymeleaf.org/

SpringBoot框架集成Thymealeaf,Thymealeaf代替jsp。
IDEA设置默认模板

SpringBoot简单实用Thymealeaf


@Controller
public class ControllerA {
@RequestMapping("/hello")
public String A(HttpServletRequest request){
request.setAttribute("data","Thymeleaf hello world");
//指定视图
//逻辑名称
return "A";
}
}
Title
Thymeleaf显示数据:

Thymeleaf模板之常用设置
application.properties配置
#开发阶段,关闭模板缓存,立即生效 spring.thymeleaf.cache=false #编码格式 spring.thymeleaf.encoding=utf-8 #模型的类型(默认html) spring.thymeleaf.mode=HTML #模板前缀、模板引擎存放路径 默认classpath:/templates/ spring.thymeleaf.prefix=classpath:/templates/ #模板后缀 默认.html spring.thymeleaf.suffix=.html
Thymeleaf模板之标准变量表达式
表达式是在页面获取数据的一种Thymeleaf语法。列:${ key}
注意:th:text=””是Thymeleaf的一个属性,用于显示文本信息。
标准变量表达式用于访问容器(tomcat)上下文环境中的变量,功能和EL中的${}相同。Thymeleaf中的变量表达式使用${变量名}的方式获取Controller中model其中的数据(request作用域中的数据)。
标准变量表达式语法:${key},作用:获取key对于的文本数据,key是request作用域中的key,使用request.setAttribute(),model.addAttribute()
在html页面中获取数据th:text=”${key}”
@Controller
@RequestMapping("/t")
public class ControllerB {
@RequestMapping("/hello2")
public String B(Model model){
model.addAttribute("Student",new Student(1,"小红","女"));
System.out.println("ControllerB");
return "abc";
}
}

student:

Thymeleaf模板之选择变量表达式
语法格式:*{key} 作用:获取key对应的数据库,*{key}需要和th:object这个属性一起使用。
@RequestMapping("/hello3")
public String C(Model model){
model.addAttribute("Student",new Student(1,"小明","男"));
System.out.println("ControllerC");
return "C";
}

Thymeleaf模板之链接表达式
语法:@{url} 作用:表示链接
列如:Thymeleaf模板之属性使用
属性是放在html元素中的,就是html元素的属性,加上th,属性的值由模板引擎处理。
属性:th:action th:method th:href th:src th:text th:style th:each
th:action
定义后台控制器的路径,类似
hello world
hello world
hello world

Thymeleaf模板之循环
th:each这个属性非常常用,与JSTL中的
循环List
循环的状态变量
Index: 当前迭代对象的下标(0-n)
Count:当前迭代对象个数(0-n)
Size:被迭代对象的大小
Current:当前迭代变量
even/odd :布尔值,当前循环是否为偶数/奇数
first:是否第一个
last:是否最后一个

Controller
// 循环list
@GetMapping("/eachList")
public String eachList(Model model){
List strList = new ArrayList<>();
strList.add("张三");
strList.add("李四");
strList.add("保国");
model.addAttribute("strList",strList);
List students = new ArrayList<>();
students.add(new Student(10,"张三","男"));
students.add(new Student(11,"李四","男"));
students.add(new Student(12,"保国","男"));
model.addAttribute("students",students);
return "E";
}
Html页面
| 下标 | id | name | sex |

循环数组Array
controller
//循环数组
@GetMapping("/eachArray")
public String array(Model model){
String[] name =new String[3];
name[0]="张三2";
name[1]="李四2";
name[2]="保国2";
model.addAttribute("names",name);
return "array";
}
Html页面
循环Array
| 编号 | name |
循环Map
Controller
//循环map
@GetMapping("/eachMap")
public String eachMap(Model model){
Map map =new HashMap<>();
map.put("stu1",new Student(11,"保国1","男"));
map.put("stu2",new Student(12,"保国2","男"));
map.put("stu3",new Student(13,"保国3","男"));
map.put("stu4",new Student(14,"菜坤","男"));
model.addAttribute("stuMap",map);
return "Map";
}
Html页面
循环Map
| 编号 | key | id | name | sex |

循环List
@GetMapping("/eachListMap")
public String eachListMap(Model model){
List
循环List-Map
| 编号 | key | id | name | sex |

Thymeleaf模板之if和unless
语法:th:if”boolean条件”,条件为true显示体内容
Th:unless是th:if的一个相反操作
显示内容
显示内容
用例
controller
@GetMapping("/ifl")
public String ifanUnless(Model model){
model.addAttribute("name","z");
model.addAttribute("login","true");
model.addAttribute("age",30);
model.addAttribute("empty1","");
model.addAttribute("fnull",null);
return "IfUnless";
}
html
张三 登入成功 年龄小于40 true 为null

Thymeleaf模板之switch-case
@GetMapping("/switch")
public String switchCase(Model model){
model.addAttribute("sex",'m');
return "switch";
}
switch的使用
男
女
未知

Thymeleaf模板之内联text
@GetMapping("/inline")
public String inlineDemo(Model model){
model.addAttribute("name","z");
model.addAttribute("age",30);
model.addAttribute("sex","m");
model.addAttribute("stu",new Student(14,"菜坤","男"));
return "inline";
}
名字[[${name}]]
年龄[(${age})]
[['I love yue']]
[[${stu.id}]],[[${stu.name}]],[[${stu.sex}]]
Thymeleaf模板之内联javascript

Thymeleaf模板之字面值
文本字面量
数字字面量
年龄小于40
Bollean字面量
登入成功
Null字面量
name不为null
true 为null
Thymeleaf模板之字符串连接
方式1
方式2

Thymeleaf模板之运算符
算术运算符:+,-,*,/,%
关系比较:>,<,>=,<= (gt,lt,ge,le)
相等判断:==,!= (eq,ne)
@GetMapping("/inline")
public String inlineDemo(Model model){
model.addAttribute("name","z");
model.addAttribute("age",30);
model.addAttribute("sex","m");
model.addAttribute("stu",new Student(14,"菜坤","男"));
model.addAttribute("fnull",null);
model.addAttribute("login",true);
return "inline";
}
运算符的使用年龄大于10
结果
为null
三元运算符:

Thymeleaf模板之内置对象使用
//内置对象
@GetMapping("/object")
public String built_in_Object(Model model, HttpServletRequest request, HttpSession session){
model.addAttribute("name","坤坤");
request.setAttribute("requestFata","request作用域数据");
request.getSession().setAttribute("sessionData","session作用域的数据");
return "builtinObject";
}
hello builtinObject
获取作用域中的数据
获取request域中的数据

Thymeleaf模板之内置#request对象方法
使用内置对象的方法

Thymeleaf模板之内置对象#session对象方法
Session表示HttpSession对象的,是#session的简单表示方式。

Thymeleaf模板之param对象
Param对象表示url请求的参数集合


Thymeleaf模板之内置工具类
#dates
@GetMapping("/unlist")
public String utileObject(Model model){
model.addAttribute("Mdate",new Date());
return "utileObject";
}
日期类工具类对象
#numbers
@GetMapping("/unlist")
public String utileObject(Model model){
model.addAttribute("numbers",45.01);
return "utileObject";
}

#strings
@GetMapping("/unlist")
public String utileObject(Model model){
model.addAttribute("Stirng","1234fdghdtgjuefS");
return "utileObject";
}

#lists

@GetMapping("/unlist")
public String utileObject(Model model){
List list = Arrays.asList("A","B","C");
return "utileObject";
}

Null处理

@GetMapping("/unlist")
public String utileObject(Model model){
Cat cat =new Cat();
cat.setName("狸花猫");
Dog dog =new Dog();
dog.setName("阿拉斯加");
Pet p =new Pet(cat,dog);
model.addAttribute("pet",p);
return "utileObject";
}

当cat值不为null时,才执行name
null处理

Thymeleaf模板之自定义模板
自定义模板,在其他模板文件中多次使用
Hello为自定义模板名称
hello world
引用模板
插入模板方式1


插入模板方式2
包含模板
方式2

html页面做模板


使用其他目录中的模板
