文章/答案/技术大牛

发布

问Thymeleaf模板
EN

Stack Overflow用户

提问于 2015-03-27 21:22:14

回答 1查看 2.3K关注 0票数 3

我有一些问题，让Thymeleaf按照我想要的方式对待模板。我以前使用过Apache，但我认为使用配置/ XML会带来很大的负担。我有一个优雅的解决方案，我甚至在Tiles XML配置中定义了我的JavaScripts和Sytlesheets。然而，我想完全脱离JSP。我见过Thymeleaf和Facelets的参考资料。我决定尝试一下Thymeleaf，但是我在获得其他所有页面的默认布局时遇到了问题。

仅就背景而言，这是我在Apache中使用的默认布局文件。

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>

<tiles:importAttribute name="javascripts"/>
<tiles:importAttribute name="stylesheets"/>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="author" content="XXXXXXXXXXX">
    <meta name="description" content="Something">
    <title><tiles:insertAttribute name="title"></tiles:insertAttribute></title>
    <!-- stylesheets -->
    <c:forEach var="css" items="${stylesheets}">
        <link rel="stylesheet" type="text/css" href="<c:url value="${css}"/>">
    </c:forEach>
    <!-- end stylesheets -->
</head>
<body>

    <!--[if lt IE 10]>
        <p class="alert alert-warning">
            Warning: You are using an unsupported version of Internet Explorer. We recommend using Internet Explorer
            10+. If you are a Windows XP user you'll need to download an alternative browsers such as FireFox, Chrome,
            Opera, or Safari. 
        </p>
    <![endif]-->

    <!-- header -->
    <div id="header">
        <tiles:insertAttribute name="header"></tiles:insertAttribute>
    </div>
    <!-- end header  -->

    <!-- content -->
    <div id="content">
        <tiles:insertAttribute name="content"></tiles:insertAttribute>
    </div>
    <!-- end content -->

    <!-- footer -->
    <div id="footer">
        <tiles:insertAttribute name="footer"></tiles:insertAttribute>
    </div>
    <!-- end footer -->

    <!-- scripts -->
    <c:forEach var="script" items="${javascripts}">
        <script src="<c:url value="${script}"/>"></script>
    </c:forEach>
    <!-- end scripts -->

</body>
</html>

我希望在Thymeleaf中复制类似的行为，在那里视图将在模板中呈现，希望这样做。

据我所知，Thymeleaf并不是这样工作的。相反，您可以定义片段，并将它们包含在每个页面中。它的工作方向相反。

我找到了GitHub https://github.com/michaelisvy/mvc-layout-samples/tree/master/src/main/webapp/WEB-INF/view/thymeleaf的例子

我不明白下面的文件。

!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head th:fragment="headerFragment">
             <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <link th:href="@{/style/app.css}" rel="stylesheet" />
    </head>
<body>
        <div class="container" style="padding-top: 50px;">
            <div th:fragment="menuFragment">
                <div class="header well">
                    <img th:src="@{/images/springsource_banner_green.png}"/>
                </div>
                <div class="page-header">
                    <h1 th:text="${title}"></h1>
                </div>  
                <ul>
                    <li><a th:href="@{/users/all/jsp-plain.htm}">No template</a></li>
                    <li><a th:href="@{/users/all/jsp-custom-1.htm}">Custom tags</a></li>
                    <li><a th:href="@{/users/all/jsp-custom-2.htm}">Custom tags with table tag</a></li>
                    <li><a th:href="@{/users/all/jsp-tiles.htm}">Apache Tiles</a></li>
                    <li><a th:href="@{/users/all/thymeleaf.htm}">Thymeleaf</a></li>
                </ul>
            </div>
        </div>

</body>
</html>

这一行没有意义，因为它不是片段的一部分，因为当它被包含在users.html中时，html结构就丢失了。

<div class="container" style="padding-top: 50px;">

本质上我想要这样的东西

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
    <div class="container" style="padding-top: 50px;">
        <div>
            <div class="header well">
                <img th:src="@{/images/springsource_banner_green.png}"/>
            </div>
            <div class="page-header">
                <h1 th:text="${title}"></h1>
            </div>
            <ul>
                <li><a th:href="@{/users/all/jsp-plain.htm}">No template</a></li>
                <li><a th:href="@{/users/all/jsp-custom-1.htm}">Custom tags</a></li>
                <li><a th:href="@{/users/all/jsp-custom-2.htm}">Custom tags with table tag</a></li>
                <li><a th:href="@{/users/all/jsp-tiles.htm}">Apache Tiles</a></li>
                <li><a th:href="@{/users/all/thymeleaf.htm}">Thymeleaf</a></li>
            </ul>
        </div>
    </div>

    <div id="content">
    <!-- PAGES SHOULD RENDER HERE, example User.html -->
    </div>

    <!-- scripts -->
    <script src="https://code.jquery.com/jquery-2.1.3.min.js" />
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

</body>
</html>

有什么想法或最佳做法吗？

spring-mvc

thymeleaf

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-03-27 22:15:27

你想要Thymeleaf方言。

票数 4

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/29310409

复制

相似问题

问Thymeleaf模板
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Thymeleaf模板EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Thymeleaf模板
EN