2017-05-31 8 views
0

以前はJSPとApache Tilesだけで作業していましたが、今は初めてThymeleafテンプレートを作成しようとしています。私が直面した問題は、カスタムヘッダー、フッター、その他のセクションをdefault.htmlに挿入する方法がわかりません。コード例を示します。Thymeleaf:default.htmlでカスタムセクションを作成

にdefault.html:default.htmlので

<!DOCTYPE html> 
<html lang="en" 
     xmlns:th="http://www.thymeleaf.org" 
     xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"> 
<head> 
    <meta charset="UTF-8"/> 
    <title>Default template</title> 
    <link rel="stylesheet" type="text/css" href="../static/css/app.css" th:href="@{/css/app.css}"/> 
    <link rel="stylesheet" type="text/css" href="../static/css/bootstrap.css" th:href="@{/css/bootstrap.css}"/> 
    <link rel="stylesheet" type="text/css" href="../static/css/myCss.css" th:href="@{/css/myCss.css}"/> 
</head> 
<body> 

<header id="header" layout:fragment="header"> 
    HEADER 
</header> 

<section id="sidemenu" layout:fragment="sideMenu"> 
    SIDE_MENU 
</section> 

<section id="site-content" layout:fragment="siteContent"></section> 

<footer id="footer" layout:fragment="footerTemplate"></footer> 

</body> 
</html> 

私は、アプリケーションのHTMLファイルのすべてを挿入するために提供される「siteContent」、および「ヘッダ」、「sideMenu」と持って「フッター」のセクションを持っています別々の対応するhtmlファイル(テンプレート)で実装され、default.htmlに挿入されます。

のindex.html:

<!DOCTYPE html> 
<html lang="en" 
     xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" 
     layout:decorator="default"> 
<head> 
    <title>Index</title> 
</head> 
<body> 
<div layout:fragment="siteContent"> 
    <h1>Hello world!</h1> 
</div> 
</body> 
</html> 

footer.html:

<!DOCTYPE html> 
<html lang="en" 
     xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" 
     layout:decorate="~{default}"> 
<head> 
    <title>Footer Template</title> 
</head> 
<body> 
<div layout:fragment="footer"> 
    Copyright © 2017 
</div> 
</body> 
</html> 

これはフッターの一例です。

SiteContent領域が正常に動作します。フッターの「著作権©2017」はdefault.htmlのフッタ領域にインポートされるはずですが、それはありません。

enter image description here

答えて

0

溶液が見出される:私は 'フッタID = "フッタ" レイアウト:= "FooterTemplateの" を含む' 使用していなければならない 代わり の「フッタID = "フッタ" レイアウト:フラグメント=」フッターテンプレート "

ところで、thymeleaf's websiteに掲載されている例は決して働かなかったが、正しい決定はなかった。

関連する問題