Как связать html-файлы в Spring?

Изучаю Spring и столкнулся с проблемой подключения одного html-файла к другому. Чтобы я header.html мог использовать в других html.
Тэг html выглядит так:

home.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Главная страница</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
</head>
<body>
<div th:insert="header :: header"></div>
</body>
</html>


header.html
<div th:fragment="header">
    <header class="site-header sticky-top py-1">
        <nav class="container d-flex flex-column flex-md-row justify-content-between">
            <a class="py-2 d-none d-md-inline-block" href="#">Tour</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Product</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Features</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Enterprise</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Support</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Pricing</a>
            <a class="py-2 d-none d-md-inline-block" href="#">Cart</a>
        </nav>
    </header>
</div>

cNJdY.png
  • Вопрос задан
  • 400 просмотров
Пригласить эксперта
Ответы на вопрос 1
azerphoenix
@azerphoenix Куратор тега Spring
Java Software Engineer
Добрый день!
Судя по коду вы используете thymeleaf.
Но я так и не увидел вашего вопроса. Вы создали фрагмент header.html при помощи th:fragment, а затем вставили этот фрагмент при помощи th:insert. А в чем заключается проблема? Что-то не работает или ...?

И в зависимости от версии thymeleaf th:insert="header :: header" это может не работать или просто выдавать предупреждение. Используйте th:insert="~{header :: header}"

Есть кстати, доп. либа, которая позволяет более гибко настраивать шаблоны - Thymeleaf Layout Dialect
https://github.com/ultraq/thymeleaf-layout-dialect

Полезная информация - https://habr.com/ru/post/351844/
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы