模板模块导入
首先定义一个/WEBINF/templates/footer.html文件:
-
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
-
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
-
<body>
-
<div th:fragment="copy">
-
© 2011 The Good Thymes Virtual Grocery
-
</div>
-
</body>
-
</html>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
上面的代码定义了一个片段称为copy,我们可以很容易地使用th:include 或者 th:replace属性包含在我们的主页上:
-
<body>
-
...
-
<div th:include=
"footer :: copy"
>
</div>
-
</body>
- 1
- 2
- 3
- 4
include的表达式想当简洁。这里有三种写法:
- “templatename::domselector” 或者 “templatename::[domselector]”引入模板页面中的某个模块。
- “templatename”引入模板页面。
- “::domselector” 或者 “this::domselector” 引入自身模板的模块
上面所有的templatename和domselector的写法都支持表达式写法:
<div th:include="footer :: (${user.isAdmin}? #{footer.admin} : #{footer.normaluser})"></div>
- 1
不使用th:fragment来引用模块
-
...
-
<div id=
"copy-section"
>
-
©
2011 The Good Thymes Virtual Grocery
-
</div>
-
...
- 1
- 2
- 3
- 4
- 5
我们可以用css的选择器写法来引入
-
<body>
-
...
-
<div th:include=
"footer :: #copy-section"
>
</div>
-
</body>
- 1
- 2
- 3
- 4
th:include 和 th:replace的区别
th:include和th:replace都可以引入模块,两者的区别在于
th:include:引入子模块的children,依然保留父模块的tag。
th:replace:引入子模块的所有,不保留父模块的tag。
举个栗子:
-
<footer th:fragment="copy">
-
© 2011 The Good Thymes Virtual Grocery
-
</footer>
- 1
- 2
- 3
引入界面:
-
<body>
-
...
-
<div th:include=
"footer :: copy"
>
</div>
-
<div th:replace=
"footer :: copy"
>
</div>
-
</body>
- 1
- 2
- 3
- 4
- 5
结果是:
-
<body>
-
...
-
<div>
-
©
2011 The Good Thymes Virtual Grocery
-
</div>
-
<footer>
-
©
2011 The Good Thymes Virtual Grocery
-
</footer>
-
</body>