SpringBoot整合之使用Thymeleaf，Freemarker
一个Java小白的学习之路 个人博客 youngljx.top
模板引擎Thymeleaf，Freemarker
jsp是在服务端渲染，模板引擎是在客户端渲染，效率更高
Spring目前亲儿子是thymeleaf，以后不知道，后缀是html。
1.SpringBoot整合Freemarker
引入freemarker模板依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
freemarker静态资源配置(application.properties)
#设定ftl文件路径,所有页面文件放到templates中
spring.framemarker.template-loader-path=classpath:/templates
#关闭缓存，即时刷新，上线生产环境需要改为true
spring.framemarker.cache=false
spring.framemarker.charset=UTF-8
spring.framemarker.check-template-location=true
spring.framemarker.content-type=text/html
spring.framemarker.expose-request-attributes=true
spring.framemarker.expose-session-attributes=true
spring.framemarker.request-context-attribute=request
#文件后缀.ftl
spring.framemarker.suffix=.ftl
测试部分
创建freemarker.index.ftl页面和freemarker.content.content.ftl页面
<!-- index.ftl -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
index页面
</body>
</html>
<!-- content.ftl -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
Content页面-ss
${resource.name}
${resource.age}
</body>
</html>
创建controller内容
package com.example.demo2.controller;
import com.example.demo2.domain.Resource;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class testFreemarker {
@Autowired
private Resource resource;
@RequestMapping("index")
public String toIndex(){
System.out.println("进来index");
return "freemarker/index";
}
@RequestMapping("toContent")
public String toContent(ModelMap map){//ModelMap相当于SpringMVC中的ModelAndView
map.addAttribute("resource",resource);
return "freemarker/content/content";
}
}
2、SpringBoot整合Thymeleaf
引入thymeleaf模板依赖
<!-- 首先引入springboot整合thymeleaf依赖 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
thymeleaf静态资源配置(application.properties)
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
#关闭缓存，即时刷新，上线生产环境需要改为true
spring.thymeleaf.cache=false
测试部分
创建thymeleaf.index.html页面和thymeleaf.content.content.html页面
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
thymeleaf:index页面
</body>
</html>
<!-- content.html -->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
thymeleaf:Content页面-ss
<h1 th:text="${name}">hello jack</h1>
</body>
</html>
controller内容
package com.example.demo2.controller;
import com.example.demo2.domain.Resource;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class testThymeleaf {
@RequestMapping("thymeleaf/index")
public String toIndex(){
return "thymeleaf/index";
}
@RequestMapping("thymeleaf/toContent")
public String toContent(ModelMap map){
map.addAttribute("name","jack");
return "thymeleaf/content/content";
}
}
参考 SpringBoot整合模板引擎
thymeleaf常用标签的使用方法
时间类型转换
<div>
<input th:id="${user.name}" th:name="${user.name}" th:value="${user.name}"/>
<input th:value="${#dates.format(user.birthday,'dd/MM/yyyy')}"/>
</div>
参考笔记 Thymeleaf 之基本用法和常见错误
补充：使用示例
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" th:href="@{/css/bootstrap.css}" type="text/css"/>
</head>
<body class="container">
<br/>
<h1>修改用户信息</h1>
<br/><br/>
<div class="with:80%">
<form class="form-horizontal" th:action="@{/edit}" th:object="${user}" method="post">
<input type="hidden" name="id" th:value="*{id}"/>
<div class="form-group">
<label for="userName" class="col-sm-2 control-label">userName</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="userName" id="userName" th:value="*{userName}"
placeholder="userName"/>
</div>
</div>
<div class="form-group">
<label for="password" class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" name="password" id="password" th:value="*{password}"
placeholder="Password"/>
</div>
</div>
<div class="form-group">
<label for="age" class="col-sm-2 control-label">age</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="age" id="age" th:value="*{age}" placeholder="age"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input type="submit" value="Submit" class="btn btn-info"/>
<a th:href="@{/list}" class="btn btn-info">Back</a>
</div>
</div>
</form>
</div>
</body>
</html>