spring boot用ModelAndView向Thymeleaf模板傳參數

本文轉載自查看原文 2021-02-21 09:30 563

最近在調試一個Spring Boot向Thymeleaf模板傳參數的例子，但踩了很多坑，這里就把詳細過程記錄下來，以供大家參考。

先說下，這里遇到哪些坑呢？

1 我用的是IDEA社區版，這不支持JSP，我本來向傳到JSP的，由於不支持，所以只能傳到HTML。

2 HMML里，必須要引入Thymeleaf模板，否則無法從ModelAndView里接收到參數。

好，然后給出我搭建項目的步驟，先創建一個名為ModelAndViewDemo的Maven項目里，而在下表里，給出了重要文件的說明。

重要文件	說明
pom.xml	引入了該項目所用到的依賴包，尤其地，引入了Thymeleaf的依賴包
SpringBootApp.java	啟動類
Controller.java	控制器類，在其中通過ModelAndView對象和前端Thymeleaf交互
Application.properties	配置文件，其中包含了Thymeleaf的相關配置
hello.html	包含Thymeleaf模板的前端頁面文件，請注意它是在resources目錄的templates目錄里，這個目錄結構需要和配置文件里的配置保持一致

第一步，在pom.xml里，包含本項目的依賴包，關鍵代碼如下所示。其中，通過第6行到第9行的代碼，引入了thymeleaf模板的依賴包。

1  <dependencies>
2	        <dependency>
3	            <groupId>org.springframework.boot</groupId>
4	            <artifactId>spring-boot-starter-web</artifactId>
5	        </dependency>
6	        <dependency>
7	            <groupId>org.springframework.boot</groupId>            
8	<artifactId>spring-boot-starter-thymeleaf</artifactId>
9	        </dependency>
10	    </dependencies>

第二步，編寫啟動類。

1	package prj;
2	import org.springframework.boot.SpringApplication;
3	import org.springframework.boot.autoconfigure.SpringBootApplication;
4	@SpringBootApplication
5	public class SpringBootApp {
6	    public static void main(String[] args) {
7	        SpringApplication.run(SpringBootApp.class, args);
8	    }
9	}

第三步，編寫控制器類，代碼如下所示。

1	package prj.controller;
2	import org.springframework.web.bind.annotation.RequestMapping;
3	import org.springframework.web.bind.annotation.RestController;
4	import org.springframework.web.servlet.ModelAndView;
5	@RestController
6	public class Controller {
7	    @RequestMapping("/welcome")
8	    public ModelAndView welcome() {
9	        ModelAndView modelAndView = new ModelAndView("hello");
10	        modelAndView.getModel().put("name", "Tom");
11	        return modelAndView;
12	    }
13	}

在第8行的welcome方法里，先是在第9行創建了ModelAndView類型的對象，並通過構造函數，指定該對象里的視圖為“hello”，隨后通過第10行的代碼，在該對象的Model里，以鍵值對的形式，添加了鍵是name值是Tom的數據。結合起來看，welcome方法將向hello視圖返回一個鍵值對數據。

第四步，在application.properties里，編寫thymeleaf模板的相關參數，具體代碼如下。

1	#啟用thymeleaf視圖
2	spring.thymeleaf.enabled=true
3	#設置Content-Type值
4	spring.thymeleaf.content-type=text/html
5	## 檢查模板是否存在，然后再呈現
6	spring.thymeleaf.check-template-location=true
7	# 不啟用緩存
8	spring.thymeleaf.cache=false
9	# 構建前綴
10	spring.thymeleaf.prefix=classpath:/templates/
11	# 構建后綴
12	spring.thymeleaf.suffix=.html

在對應的參數項前都有注釋，大家可以自行閱讀，不過這里有如下兩大注意點。

為了要使用thymeleaf視圖，必須要配置如第2行所示的參數。
第10行和第12行定義的前綴和后綴，會和ModelAndView對象里的視圖整合起來使用。比如在Controller.java里，ModelAndView里返回的視圖是hello,所以會對應地加上前后綴，加號以后的值是classpath:/templates/hello.html，這樣能指定最終跳轉到的視圖文件位置。

第五步，需要編寫包含thymeleaf模板的hello.html頁面，代碼如下所示。

1	<!DOCTYPE html>
2	<html  lang="en" xmlns:th="http://www.thymeleaf.org">
3	<head>
4	    <meta charset="UTF-8">
5	    <title>welcome</title>
6	</head>
7	<body>
8	    Welcome:<span th:text="${name}"></span>
9	</body>
10	</html>

其中在第2行，指定了第8行要用到的th標簽的命名空間，這是來自於thymeleaf模板。

而在第8行里，通過th:text="${name}"的形式，指定了存放${name}參數的占位符，而具體的name參數值，會來自於后端的返回。從這個頁面里，大家能看到thymeleaf模板如下的樣式特征。

本范例中，thymeleaf模板是嵌入在HTML5代碼里的，在使用時，需要如第2行所示，引入要用到該模板屬性元素的命名空間。
在諸如html5的前端頁面里，可以像第8行那樣，通過thymeleaf的語法，設置參數的占位符，這樣當后端通過ModelAndView等形式傳遞來參數時，就能在占位符所在的位置，動態展示。

完成開發后啟動該項目，並如控制器里welcome方法之前的@RequestMapping注解所示，在瀏覽器里輸入http://localhost:8080/welcome，就能看到輸出“Welcome:Tom“的字樣。而從發起請求到展示數據，主要經歷了如下的流程。

根據@RequestMapping注解所定義，http://localhost:8080/welcome請求被welcome方法所處理。
在welcome方法里設置了返回視圖為hello，並設置了name參數的值是Tom。
根據application.properties里的配置，會根據配置好的前后綴，確定待返回的視圖頁面，這里是resources（由於該目錄是在本項目的classpath里）目錄下的templates目錄里的hello.html。
最終會展示hello.html，並在其中thymeleaf模板所定義，在name參數占位符所在的位置展示“Tom”字樣。由此展示大家最終看到的結果。

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 spring boot thymeleaf模板url上的參數傳遞 Spring Boot 2.0 整合Thymeleaf 模板引擎 Spring Boot Thymeleaf 模板引擎的使用 Spring Boot Web開發與thymeleaf模板引擎 Thymeleaf 模板在spring boot 中的引用和應用 Spring Boot （四）模板引擎Thymeleaf集成極簡 Spring Boot 整合 Thymeleaf 頁面模板 Spring-Boot Thymeleaf 模板嵌套布局 Spring Boot入門——thymeleaf模板使用 spring boot:thymeleaf給fragment傳遞參數的方法(spring boot 2.3.3)