springboot(三)springboot整合thymeleaf

本文介绍了如何将Thymeleaf模板引擎与SpringBoot进行整合,包括添加项目依赖、配置application.properties、创建模板文件夹及HTML页面、编写ThymeleafController以及启动后访问各个页面的路径。
摘要由CSDN通过智能技术生成

一、springboot整合thymeleaf

1.1 新建maven项目导入依赖

		<!-- spring boot starter-thymeleaf thymeleaf模板依赖  -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>

项目完整pom依赖

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>com.itcast</groupId>
  <artifactId>springboot-thymeleaf-005</artifactId>
  <version>0.0.1-SNAPSHOT</version>
  <packaging>war</packaging>
   
  <!-- 引入springboot父类依赖 -->
	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>2.0.2.RELEASE</version>
		<relativePath /> <!-- lookup parent from repository -->
	</parent>

	<properties>
		<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
		<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
		<java.version>1.8</java.version>
	</properties>

	<dependencies>
		<!-- spring boot 依赖 -->
		<!-- spring boot starter -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter</artifactId>
		</dependency>
		<!-- spring-boot-configuration-processor 资源文件-->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-configuration-processor</artifactId>
			<optional>true</optional>
		</dependency>
		<!-- spring boot starter-test  -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
		<!-- spring boot starter-web -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		
		<!-- spring boot starter-freemarker freemarker模板依赖  -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-freemarker</artifactId>
		</dependency>
		
		<!-- spring boot starter-thymeleaf thymeleaf模板依赖  -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>
	</dependencies>

	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
		</plugins>
	</build>
  
</project>

1.2 添加thymeleaf配置信息application.properties

#########################################################################
#
#thymeleaf 静态资源配置
#
##########################################################################
#指定模板的前缀,默认为:classpath:/templates/
spring.thymeleaf.prefix=classpath:/templates/

#指定模板的后缀,默认为:.html
spring.thymeleaf.suffix=.html

#指定模板的模式,具体查看StandardTemplateModeHandlers,默认为: HTML5
spring.thymeleaf.mode=HTML5

#指定模板的编码,默认为: UTF-8
spring.thymeleaf.encoding=UTF-8

#指定Content-Type,默认为: text/html
spring.thymeleaf.content-type=text/html

#是否开启模板缓存,默认true.关闭缓存,及时刷新,上线环境需要改为true
spring.thymeleaf.cache=false

#是否检查模板路径是否存在,默认true
#spring.thymeleaf.check-template-location

#是否允许MVC使用Thymeleaf,默认为: true
#spring.thymeleaf.enabled

#指定不使用模板的视图名称,多个以逗号分隔.
#spring.thymeleaf.excluded-view-names

#指定模板的解析顺序,默认为第一个.
#spring.thymeleaf.template-resolver-order

#指定使用模板的视图名,多个以逗号分隔.
#spring.thymeleaf.view-names

完整application.properties

#########################################################################
#
#freemarker 静态资源配置
#
##########################################################################
#设定ftl文件模板的加载路径,多个以逗号分隔,默认: ["classpath:/templates/"]
spring.freemarker.template-loader-path=classpath:/templates
#是否开启template caching.关闭缓存,及时刷新,上线环境需要改为true
spring.freemarker.cache=false
#设定Template的编码.设置为uft-8
spring.freemarker.charset=utf-8
#是否检查templates路径是否存在.设置为true
spring.freemarker.check-template-location=true
#设定Content-Type.
spring.freemarker.content-type=text/html
#设定所有request的属性在merge到模板的时候,是否要都添加到model中.
spring.freemarker.expose-request-attributes=true
#设定所有HttpSession的属性在merge到模板的时候,是否要都添加到model中.
spring.freemarker.expose-session-attributes=true
#指定RequestContext属性的名.
spring.freemarker.request-context-attribute=request
#设定freemarker模板的前缀.
#spring.freemarker.prefix=

#设定freemarker模板的后缀.
spring.freemarker.suffix=.ftl

#指定使用模板的视图列表.
#spring.freemarker.view-names

#是否允许mvc使用freemarker.
#spring.freemarker.enabled

#指定HttpSession的属性是否可以覆盖controller的model的同名项
#spring.freemarker.allow-session-override

#指定HttpServletRequest的属性是否可以覆盖controller的model的同名项
#spring.freemarker.allow-request-override=false

#设定是否以springMacroRequestContext的形式暴露RequestContext给Spring’s macro library使用
#spring.freemarker.expose-spring-macro-helpers=false

#是否优先从文件系统加载template,以支持热加载,默认为true
#spring.freemarker.prefer-file-system-access

#设定FreeMarker keys.
#spring.freemarker.settings

#########################################################################
#
#thymeleaf 静态资源配置
#
##########################################################################
#指定模板的前缀,默认为:classpath:/templates/
spring.thymeleaf.prefix=classpath:/templates/

#指定模板的后缀,默认为:.html
spring.thymeleaf.suffix=.html

#指定模板的模式,具体查看StandardTemplateModeHandlers,默认为: HTML5
spring.thymeleaf.mode=HTML5

#指定模板的编码,默认为: UTF-8
spring.thymeleaf.encoding=UTF-8

#指定Content-Type,默认为: text/html
spring.thymeleaf.content-type=text/html

#是否开启模板缓存,默认true.关闭缓存,及时刷新,上线环境需要改为true
spring.thymeleaf.cache=false

#是否检查模板路径是否存在,默认true
#spring.thymeleaf.check-template-location

#是否允许MVC使用Thymeleaf,默认为: true
#spring.thymeleaf.enabled

#指定不使用模板的视图名称,多个以逗号分隔.
#spring.thymeleaf.excluded-view-names

#指定模板的解析顺序,默认为第一个.
#spring.thymeleaf.template-resolver-order

#指定使用模板的视图名,多个以逗号分隔.
#spring.thymeleaf.view-names

#########################################################################
#
# 静态资源配置
#
##########################################################################


1.3 在main/resources/templates 新增thymeleaf文件夹,新建一个index.html,新建一个文件夹center,里面新一个center.html  test.html

index.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>index Page</title>
</head>
<body>
Thymeleaf模板引擎
<h1 th:text="${name}"> hello world ~ ~ ~index Page</h1>
</body>
</html>

center.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>center Page</title>
</head>
<body>
Thymeleaf模板引擎
<h1 > hello world ~ ~ ~center Page</h1>
</body>
</html>

test.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
	<div>
		用户姓名:<input th:id="${user.name}" th:name="${user.name}" th:value="${user.name}"/><br/>
		用户年龄:<input th:value="${user.age}"/><br/>
		用户生日:<input th:value="${user.birthday}"/><br/>
		用户生日:<input th:value="${#dates.format(user.birthday,'yyyy-MM-dd hh:mm:ss')}"/><br/>
	</div>

	<div><hr></div>
		<div th:object="${user}">
		用户姓名:<input th:id="*{name}" th:name="*{name}" th:value="*{name}"/><br/>
		用户年龄:<input th:value="*{age}"/><br/>
		用户生日:<input th:value="*{birthday}"/><br/>
		用户生日:<input th:value="*{#dates.format(birthday,'yyyy-MM-dd hh:mm:ss')}"/><br/>
	</div>
	

</body>
</html>

1.4 编写ThymeleafControllercontroller

package com.itcast.controller;

import java.util.Date;

import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;

import com.itcast.entity.User;
/**
 * 访问路径:http://localhost:8080/th/index
 * 访问路径:http://localhost:8080/th/center
 * 访问路径:http://localhost:8080/th/test
 * @author jack
 *
 */
@Controller
@RequestMapping("th")
public class ThymeleafController {

	@RequestMapping("/index")
	public String index(ModelMap map){
		map.addAttribute("name", "Thymeleaf-itcast");
		
		return "thymeleaf/index";
	}
	
	@RequestMapping("/center")
	public String center(){	
		return "thymeleaf/center/center";
	}
	@RequestMapping("/test")
	public String test(ModelMap map){
		User u1=new User();
		u1.setName("水晶叶");
		u1.setAge(19);
		u1.setPassword("123456");
		u1.setBirthday(new Date());
		u1.setDesc("帅哥");
		map.addAttribute("user", u1);
		
		return "thymeleaf/center/test";
	}
}

user实体

package com.itcast.entity;

import java.util.Date;

import com.fasterxml.jackson.annotation.JsonFormat;
import com.fasterxml.jackson.annotation.JsonIgnore;
import com.fasterxml.jackson.annotation.JsonInclude;
import com.fasterxml.jackson.annotation.JsonInclude.Include;
/**
 * 
 * @author jack
 *
 */
public class User {
	private String name;
	@JsonIgnore
	private String password;
	private Integer age;
	@JsonFormat(pattern="yyyy-MM-dd hh:mm:ss a",locale="zh",timezone="GMT+8")
	private Date birthday;
	@JsonInclude(Include.NON_NULL)
	private String desc;
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	public Integer getAge() {
		return age;
	}
	public void setAge(Integer age) {
		this.age = age;
	}
	public Date getBirthday() {
		return birthday;
	}
	public void setBirthday(Date birthday) {
		this.birthday = birthday;
	}
	public String getDesc() {
		return desc;
	}
	public void setDesc(String desc) {
		this.desc = desc;
	}
	@Override
	public String toString() {
		return "User [name=" + name + ", password=" + password + ", age=" + age + ", birthday=" + birthday + ", desc="
				+ desc + "]";
	}

	
}

1.5 启动入口类,访问

访问路径:http://localhost:8080/th/index

访问路径:http://localhost:8080/th/center

访问路径:http://localhost:8080/th/test












评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值