springboot-thymeleaf模板引擎(第七篇)

Thymeleaf是现代服务器端java模板引擎,能很好的嵌入到开发工作中,HTML可以在浏览器中正确显示,也可以作为静态原型来工作,从而允许开发团队进行更强的协作。并很好的集成到spring中,是一种理想的开发web开发。

官网:https://www.thymeleaf.org/



创建thymeleaf项目




创建完成目录结构如下:



在pom.xml中引入依赖包

<?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.example.springboot</groupId>
    <artifactId>springboot-thymeleaf</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <packaging>jar</packaging>

    <name>springboot-thymeleaf</name>
    <description>Demo project for Spring Boot</description>

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

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>1.5.12.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <!--引入thymeleaf依赖包 注释快捷键:Ctrl+Shift+/ -->
        <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>
在application.properties配置文件增加thymeleaf配置

#修改server端口
#server.port=8085
#server.context-path=/springdemo

#thymeleaf
# 前后缀设置
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
#spring.thymeleaf.mode=HTML5
#编码设置
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
#是否缓存文件
spring.thymeleaf.cache=false


#添加jsp配置
# 页面默认前缀目录
spring.mvc.view.prefix=/WEB-INF/jsp/
# 响应页面默认后缀
spring.mvc.view.suffix=.jsp
# 自定义属性,可以在Controller中读取
application.hello=Hello Angel From application

编写conroller类

package com.example.springboot.thymeleaf.controller;

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

/**
 * @desc 注入使用Controller,而不是RestController,因为它是rest接口(json格式),是解析不到html
 * @Author wangsh
 * @date 2018/5/5 15:13
 */
@Controller
@RequestMapping("/templates")
public class ThymeleafController {

   @RequestMapping("/hello.do")
   public String hello(Model model) {
      System.out.println("hello...........");
      model.addAttribute("content", "Thymeleaf 测试");
      return "hello";
   }
}


编写thymeleaf模板文件

在src/main/resources/templates/hello.html创建模板文件

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Insert title here</title>
</head>
<body>
<h1 th:inline="text">hello.v.2</h1>
<span th:text="${content}"></span>
ThymeleafController测试20180505
</body>
</html>

编写启动服务类

package com.example.springboot.freemarker;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class SpringbootFreemarkerApplication {

   public static void main(String[] args) {
      SpringApplication.run(SpringbootFreemarkerApplication.class, args);
   }
}


启动测试


浏览器输入:http://localhost:8080/templates/hello.do, 访问后如下






猜你喜欢

转载自blog.csdn.net/seashouwang/article/details/80206392