如何使用 Thymeleaf 将 html 文件包含到另一个 html 文件中
Cod*_*son 5 html java spring-mvc thymeleaf
我一直在查看有关如何使用 Thymeleaf 的 th:insert 将 html 文件包含到另一个 html 文件中的所有可用资源。我想知道是否有人能告诉我我做错了什么，因为我觉得这个 html 看起来和我看到的例子完全一样。
我的 index.html
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.thymeleaf.org ">
<head>
<title>Default Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<div th:insert="templates/Navbar :: navbar"> </div>
</body>
</html>
我的导航栏.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.thymeleaf.org ">
<head>
<meta charset="UTF-8"/>
<title>NavigationBar</title>
<link rel="stylesheet" type="text/css" media="all" href="../../css/NavBar.css" th:href="@{/css/NavBar.css}" />
</head>
<body>
<div>
<div th:fragment="navbar" class="navbar">
<div class="navbar-inner">
<a th:href="@{/}" href="/home"> Home</a>
<a th:href="@{/}" href="/help">Help</a>
</div>
</div>
</div>
</body>
</html>
此外，这是我的项目资源层次结构，通过屏幕截图
如果我将 之间的代码放入 index.html 并链接 css 文件，导航栏就会显示并工作。所以，我不确定为什么插入不起作用。这是我根据以下示例编辑的配置文件：
@Configuration
public class WebPageControllerConfig {
private SpringTemplateEngine templateEngine;
private ServletContextTemplateResolver templateResolver;
@Value("${WebController.startHour}")
public String startHour;
@Value("${WebController.endHour}")
public String endHour;
@Value("${WebController.numOfSkus}")
public int numOfSkus;
@Value("${WebController.skusToQuery}")
public File skusToQuery;
@Bean
public ClassLoaderTemplateResolver webPageTemplateResolver(){
ClassLoaderTemplateResolver webPageTemplateResolver = new ClassLoaderTemplateResolver();
webPageTemplateResolver.setPrefix("templates/");
webPageTemplateResolver.setSuffix(".html");
webPageTemplateResolver.setTemplateMode("HTML5");
webPageTemplateResolver.setCharacterEncoding(CharEncoding.UTF_8);
webPageTemplateResolver.setOrder(1);
return webPageTemplateResolver;
}
/* Old way of trying to configure
@Bean
public MessageSource messageSource() {...}
@Bean
public ServletContextTemplateResolver setTemplateResolver(){...}
@Bean
public SpringTemplateEngine setTemplateEngine() {...}
@Bean
public ViewResolver viewResolver() {...}
End of old configuration */
public String getStartHour() {return startHour;}
public String getendHour() {return endHour;}
public Object getnumOfSkus() {return numOfSkus;}
public File getSkusToQuery(){return skusToQuery;}
}
改成
th:insert="templates/Navbar :: navbar"
和
th:fragment="navbar"
配置示例：
import org.apache.commons.lang3.CharEncoding;
import org.springframework.context.annotation.*;
import org.thymeleaf.templateresolver.ClassLoaderTemplateResolver;
@Configuration
public class ThymeleafConfiguration {
@Bean
@Description("Thymeleaf template resolver serving HTML 5 emails")
public ClassLoaderTemplateResolver emailTemplateResolver() {
ClassLoaderTemplateResolver emailTemplateResolver = new ClassLoaderTemplateResolver();
emailTemplateResolver.setPrefix("root folder where all thymeleaf files/");
emailTemplateResolver.setSuffix(".html");
emailTemplateResolver.setTemplateMode("HTML5");
emailTemplateResolver.setCharacterEncoding(CharEncoding.UTF_8);
emailTemplateResolver.setOrder(1);
return emailTemplateResolver;
}
}