The first template page Thymeleaf
# This section Video
# Introduced dependence
The main increase spring-boot-starter-thymeleaf
and nekohtml
both rely
spring-boot-starter-thymeleaf
: Thymeleaf automatic configurationnekohtml
: Allowing the use of non-strict HTML syntax
Complete pom.xml
the following:
<?xml version="1.0" encoding="UTF-8"?> <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.funtl</groupId> <artifactId>hello-spring-boot</artifactId> <version>0.0.1-SNAPSHOT</version> <packaging>jar</packaging> <name>hello-spring-boot</name> <description></description> <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> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-tomcat</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-actuator</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> <scope>test</scope> </dependency> <dependency> <groupId>net.sourceforge.nekohtml</groupId> <artifactId>nekohtml</artifactId> <version>1.9.22</version> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> <configuration> <mainClass>com.funtl.hello.spring.boot.HelloSpringBootApplication</mainClass> </configuration> </plugin> </plugins> </build> </project>
# In the application.yml
configuration Thymeleaf
spring: thymeleaf: Cache: false Close cached # developers, or can not see the real-time page mode: HTML # non-strict HTML encoding: UTF-8 servlet: content-type: text/html
# Create a test using JavaBean
Create a test the effect of JavaBean, it can be a simple package
package com.funtl.hello.spring.boot.entity; import java.io.Serializable; public class PersonBean implements Serializable { private String name; private Integer age; public String getName() { return name; } public void setName(String name) { this.name = name; } public Integer getAge() { return age; } public void setAge(Integer age) { this.age = age; } }
# Create a test Controller
Creating a Controller, made some test data and settings Jump
package com.funtl.hello.spring.boot.controller; import com.funtl.hello.spring.boot.entity.PersonBean; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import java.util.ArrayList; import java.util.List; @Controller @RequestMapping(value = "thymeleaf") public class IndexController { @RequestMapping(value = "index", method = RequestMethod.GET) public String index(Model model) { PersonBean person = new PersonBean(); person.setName ( "Joe Smith" ); person.setAge(22); List<PersonBean> people = new ArrayList<>(); PersonBean p1 = new PersonBean(); p1.setName ( "John Doe" ); p1.setAge(23); people.add(p1); PersonBean p2 = new PersonBean(); p2.setName ( "King of Five" ); p2.setAge(24); people.add(p2); PersonBean p3 = new PersonBean(); p3.setName("赵六"); p3.setAge(25); people.add(p3); model.addAttribute("person", person); model.addAttribute("people", people); return "index"; } }
# Create a test page
In the templates
creation directory index.html
file, the code is as follows:
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Hello Thymeleaf</title> </head> <body> <div> <span>访问 Model:</span><span th:text="${person.name}"></span> </div> <div> <span>访问列表</span> <table> <thead> <tr> <th>姓名</th> <th>年龄</th> </tr> </thead> <tbody> <tr th:each="human : ${people}"> <td th:text="${human.name}"></td> <td th:text="${human.age}"></td> </tr> </tbody> </table> </div> </body> </html>
Modify html tags for introducing thymeleaf engine, so that it can be used in other tag th:*
syntax, the following statement:
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
# Test Access
After a successful start, visit: http: // localhost: 9090 / thymeleaf / index to see results