how2j.cn

下载区
文件名 文件大小
thymeleaf.rar 2k

解压rar如果失败，请用5.21版本或者更高版本的winrar

点击下载 winrar5.21
步骤 1 : 什么是 thymeleaf   
步骤 2 : 先运行，看到效果，再学习   
步骤 3 : 模仿和排错   
步骤 4 : 基于前面的知识点   
步骤 5 : pom.xml   
步骤 6 : 增加个控制器   
步骤 7 : hello.html   
步骤 8 : application.properties   
步骤 9 : 重启测试   

步骤 1 :

什么是 thymeleaf

edit 顶 折
纠 问
thymeleaf 跟 JSP 一样，就是运行之后，就得到纯 HTML了。 区别在与，不运行之前， thymeleaf 也是 纯 html ...
所以 thymeleaf 不需要 服务端的支持，就能够被以 html 的方式打开，这样就方便前端人员独立设计与调试, jsp 就不行了， 不启动服务器 jsp 都没法运行出结果来。
步骤 2 :

先运行，看到效果，再学习

edit 顶 折
纠 问
老规矩，先下载右上角的可运行项目，配置运行起来，确认可用之后，再学习做了哪些步骤以达到这样的效果。
运行 Application.java, 然后访问地址：

http://127.0.0.1:8080/thymeleaf/hello

就可以看到如图所示的三行话
先运行，看到效果，再学习
步骤 3 :

模仿和排错

edit 顶 折
纠 问
在确保可运行项目能够正确无误地运行之后，再严格照着教程的步骤，对代码模仿一遍。
模仿过程难免代码有出入，导致无法得到期望的运行结果，此时此刻通过比较正确答案 ( 可运行项目 ) 和自己的代码，来定位问题所在。
采用这种方式，学习有效果，排错有效率，可以较为明显地提升学习速度，跨过学习路上的各个槛。

推荐使用diffmerge软件，进行文件夹比较。把你自己做的项目文件夹，和我的可运行项目文件夹进行比较。
这个软件很牛逼的，可以知道文件夹里哪两个文件不对，并且很明显地标记出来
这里提供了绿色安装和使用教程：diffmerge 下载和使用教程
步骤 4 :

基于前面的知识点

edit 顶 折
纠 问
thymeleaf 可以配合 Servlet 运行，但是比较常见的是配合 springboot 来运行。 当然本质上也是配合springboot 里的 springmvc 来运行的，毕竟 springboot 本身就是个老鸨，干活的还是 springmvc。
本知识点基于前面的 springboot 配置切换 的基础上展开。 所以如果没有学过 springboot, 还是把 springboot 过一遍的好，至少要过到 springboot 配置切换 这里。
步骤 5 :

pom.xml

edit 顶 折
纠 问
修改 pom.xml, 增加了对 thymeleaf 的支持。

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<?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.how2java</groupId> <artifactId>thymeleaf</artifactId> <version>0.0.1-SNAPSHOT</version> <name>thymeleaf</name> <description>thymeleaf</description> <packaging>war</packaging> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.9.RELEASE</version> </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-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-tomcat</artifactId> </dependency> <dependency> <groupId>junit</groupId> <artifactId>junit</artifactId> <version>3.8.1</version> <scope>test</scope> </dependency> <!-- servlet依赖. --> <dependency> <groupId>javax.servlet</groupId> <artifactId>javax.servlet-api</artifactId> </dependency> <dependency> <groupId>javax.servlet</groupId> <artifactId>jstl</artifactId> </dependency> <!-- tomcat的支持.--> <dependency> <groupId>org.apache.tomcat.embed</groupId> <artifactId>tomcat-embed-jasper</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> <optional>true</optional> <!-- 这个需要为 true 热部署才有效 --> </dependency> </dependencies> <properties> <java.version>1.8</java.version> </properties> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build> </project>
步骤 6 :

增加个控制器

edit 顶 折
纠 问
很简单，访问地址 hello, 跳转到 hello.html ，并带上数据 "name"， 其值是 "thymeleaf"
package com.how2java.springboot.web; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.RequestMapping; @Controller public class HelloController { @RequestMapping("/hello") public String hello(Model m) { m.addAttribute("name", "thymeleaf"); return "hello"; } } 
package com.how2java.springboot.web;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
 
@Controller
public class HelloController {
 
    @RequestMapping("/hello")
    public String hello(Model m) {
    	m.addAttribute("name", "thymeleaf");
        return "hello";
    }
}
步骤 7 :

hello.html

edit 顶 折
纠 问
在 resources 下新建目录 templates, 然后新建文件 hello.html
注： 并不是在 webapp下，这点和 jsp 不一样
hello.html 做了如下事情：
1. 声明当前文件是 thymeleaf, 里面可以用th开头的属性

<html xmlns:th="http://www.thymeleaf.org">


2. <head> 内容和普通 html 并无二致，略过

3. 把 name 的值显示在当前 p里，用的是th开头的属性: th:text, 而取值用的是 "${name}" 这种写法叫做 ognl，额。。。什么意思呢。。。就是跟EL表达式一样吧。 这样取出来放进p 里，从而替换到 原来p 标签里的 4个字符 "name" .

<p th:text="${name}" >name</p>

用这种方式，就可以把服务端的数据，显示在当前html里了。 重要的是： 这种写法是完全合法的 html 语法，所以可以直接通过浏览器打开 hello.html,也是可以看到效果的， 只不过看到的是 "name", 而不是 服务端传过来的值 "thymeleaf"。

4. 字符串拼写。 两种方式，一种是用加号，一种是在前后放上 ||, 显然第二种方式可读性更好。
<p th:text="'Hello！ ' + ${name} + '!'" >hello world</p>
<p th:text="|Hello！ ${name}!|" >hello world</p>
这两种方式都会得到： hello thymeleaf。
hello.html
<!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <head> <title>hello</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> <p th:text="${name}" >name</p> <p th:text="'Hello！ ' + ${name} + '!'" >hello world</p> <p th:text="|Hello！ ${name}!|" >hello world</p> </body> </html> 
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>hello</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<p th:text="${name}" >name</p>
<p th:text="'Hello！ ' + ${name} + '!'" >hello world</p>
<p th:text="|Hello！ ${name}!|" >hello world</p>
</body>

</html>
步骤 8 :

application.properties

edit 顶 折
纠 问
application.properties 撸成这样
#thymeleaf 配置 spring.thymeleaf.mode=HTML5 spring.thymeleaf.encoding=UTF-8 spring.thymeleaf.content-type=text/html #缓存设置为false, 这样修改之后马上生效，便于调试 spring.thymeleaf.cache=false #上下文 server.context-path=/thymeleaf 
#thymeleaf 配置
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
#缓存设置为false, 这样修改之后马上生效，便于调试
spring.thymeleaf.cache=false
#上下文
server.context-path=/thymeleaf
步骤 9 :

重启测试

edit 顶 折
纠 问
运行 Application.java, 然后访问地址：

http://127.0.0.1:8080/thymeleaf/hello
重启测试


HOW2J公众号，关注后实时获知最新的教程和优惠活动，谢谢。


问答区域    
2022-01-29 hello.html里${name}有红色下划线
LST666

关于 JAVA 框架-SpringBoot-入门 的提问



hello.html中的${name}有红下划线原因“无法解析”
<body>
<p th:text="${name}"  >name</p>
<p th:text="'Hello' + ${name} + '!'">hello world</p>
<p th:text="|Hello ${name}!|">hello world</p>
</body>

							

						
				
					
						
			

		

	
		











1 个答案 
	

	
	

		
		


				
				
		
		
		
				pxq123456 
					

					
				
				

				
				
					答案时间：2022-07-15
				
				
				
		
		
			
idea 解决：setting——Inspection——thymelef ——将第一个打勾的给去掉

		

							
		
		
		
		
	
	
	












	






		
		
		
		
		














	

		回答已经提交成功，正在审核。 请于 我的回答 处查看回答记录，谢谢	
	






		

		

		答案 或者
		代码
			 请至少填写一项, 如果是自己有问题，请重新提问，否则站长有可能看不到
		

		
		

		

			

				
				
					
					

						
			

			

				
				
					
					

						
			

		

		
			
		

			
			

			
		

		
					
	


			







		
	
		
		
		
			

			

		
		
	    
	    
	  

	

	
	
	
	

	
	
	


	

	  

	  		
	  
	  	2022-01-22
	  		
	  				
	  					 
	  
					
						2.5.9版本，必须返回ModelAndView 对象才能跳转页面 
					
					
						
							
						
											
							
					
					

					
	  

	  
	  
	  

	    
		

			

				
				
					
					
					
					
					
					lys852 
					
					

					
					
					
					


						
				
				
					
						
关于
							
							
								
									 
									JAVA 框架-SpringBoot-入门
									
								
							
							 的提问
						

 					
					
					
					
					

					

					
									
						

						

							
如题，使用String返回的就是个hello

								
						
		
						

								
						
		
						

							

								
    @RequestMapping("/hellothymeleafNew")
    public ModelAndView hellothymeleafNew(Model m) {
        m.addAttribute("name", "lllyysss");
        ModelAndView mav = new ModelAndView();
        mav.setViewName("hello");
        return mav;
    }

							

						

								
						

							

								

							

						
				
					
						
			

		

	
		











1 个答案 
	

	
	

		
		


				
				
		
		
		
				lys852 
					

					
				
				

				
				
					答案时间：2022-01-22
				
				
				
		
		
			
找到问题了，是用了restcontroller的缘故，用了controller就ok了

		

							
		
		
		
		
	
	
	












	






		
		
		
		
		














	

		回答已经提交成功，正在审核。 请于 我的回答 处查看回答记录，谢谢	
	






		

		

		答案 或者
		代码
			 请至少填写一项, 如果是自己有问题，请重新提问，否则站长有可能看不到
		

		
		

		

			

				
				
					
					

						
			

			

				
				
					
					

						
			

		

		
			
		

			
			

			
		

		
					
	


			







		
	
		
		
		
			

			

		
		
	    
	    
	  

	

	
	
	
	

	
	
	


	

	  

	  		
	  
	  	2021-10-17
	  		
	  				
	  					 
	  
					
						控制器跳转疑问？ 
					
					
						
							
						
											
							
					
					

					
	  

	  
	  
	  	    
	    
	  

	

	
	
	
	

	
	
	


	

	  

	  		
	  
	  	2020-09-26
	  		
	  				
	  					 
	  
					
						关于404的问题可以看下这里来解决 
					
					
						
							
						
											
							
					
					

					
	  

	  
	  
	  	    
	    
	  

	

	
	
	
	

	
	
	


	

	  

	  		
	  
	  	2020-05-05
	  		
	  				
	  					 
	  
					
						thymeleaf配置没必要加 
					
					
						
							
						
											
							
					
					

					
	  

	  
	  
	  	    
	    
	  

	

	
	
	
	






	






			
			
			
			
			









提问太多，页面渲染太慢，为了加快渲染速度，本页最多只显示几条提问。还有 20 条以前的提问，请 点击查看 


			













		

			
		

		

			
			提问之前请登陆
			
		





	

		提问已经提交成功，正在审核。 请于 我的提问 处查看提问记录，谢谢	
	






		

		
关于
		 
		JAVA 框架-SpringBoot-入门 
		
		 的提问

		

		
		
		

		
尽量提供截图、代码和异常信息，有助于分析和解决问题。
		
		
		
		
			也可进本站QQ群交流: 578362961
			


				提问尽量提供完整的代码，环境描述，越是有利于问题的重现，您的问题越能更快得到解答。

				对教程中代码有疑问，请提供是哪个步骤，哪一行有疑问，这样便于快速定位问题，提高问题得到解答的速度 

				在已经存在的几千个提问里，有相当大的比例，是因为使用了和站长不同版本的开发环境导致的,比如 jdk, eclpise, idea, mysql,tomcat 等等软件的版本不一致。

				请使用和站长一样的版本，可以节约自己大量的学习时间。 站长把教学中用的软件版本整理了，都统一放在了这里， 方便大家下载：
				https://how2j.cn/k/helloworld/helloworld-version/1718.html
				 
				
				
				
				 



			

		 
		
		
		
		

		

		

			

				
					
						上传截图