3.7 模板布局

模板名称:layout.html

3.7.1 th:fragment

e.g.模板名为footer.html页面body部分如下:
<body>
  <div th:fragment="copy">
&copy; 2011 The Good Thymes Virtual Grocery
</div>
</body>
fragment片段定义语法:
如th:fragment=”copy”这样就定义了一个名为copy的fragment

3.7.2 th:include  and th:replace

<1>引入fragment的形式:    简单地,templatename::fragmentname(不惟一)
 <div th:insert="~{footer :: copy}"></div>
equals.
<div th:insert="footer :: copy"></div>
<2>二者的区别 th:include:将fragment的内容包含进来; th:replace:用fragment替换掉所在标签
        

3.7.3 th:remove

一般用于将模拟数据在真实环境中移除:  
th:remove可以以五种不同的方式行事,具体取决于它的价值
  • all:删除包含标签及其所有子项。
  • body:不要删除包含的标签,但删除其所有的孩子。
  • tag:删除包含的标签,但不要删除其子项。
  • all-but-first:除去第一个包含标签的所有子项。
  • none: 没做什么。该值对于动态评估是有用的。
e.g.
 <tr th:remove="all">
<td>Mild Cinnamon</td>
<td>1.99</td>
<td>yes</td>
</tr> <a href="/something" th:remove="${condition}? tag : none">Link text not to be removed</a>

3.8 th:with

模板名称:with.html 定义局部变量

1.可一次定义多个,逗号分隔

e.g.
<div th:with="firstPer=${list[0]}">
<p>The name of the first person is <span th:text="${firstPer.userName}">Julius Caesar</span>.</p>
</div>
<div th:with="firstPer=${list[0]},secondPer=${list[1]}">
<p>The name of the first person is <span th:text="${firstPer.userName}">Julius Caesar</span>.</p>
<p> But the name of the second person is <span th:text="${secondPer.userName}">Marcus Antonius</span>.
</p>
</div>

2.可复用

e.g.
<div th:with="company=${user.company},account=${accounts[company]}">
<div th:text="${company}"></div>
<div th:text="${account}"></div>
</div>

3.9 属性优先级

  

(八)Thymeleaf的 th:* 属性之—— 模板布局& th:with& 属性优先级的更多相关文章

  1. thymeleaf 模板布局

    八.模板布局(Template Layout) 8.1 包含模板片段(Including template fragments) 定义和引用片段 我们通常想要从别的模板文件中调用一些模板片段,例如 页 ...

  2. Thymeleaf+SpringMVC,如何从模板中获取数据

    Thymeleaf+SpringMVC,如何从模板中获取数据 在一个典型的SpringMVC应用中,带@Controller注解的类负责准备数据模型Map的数据和选择一个视图进行渲染.这个模型Map对 ...

  3. Thymeleaf+SpringMVC,如何从模板中获取数据(转)

    在一个典型的SpringMVC应用中,带@Controller注解的类负责准备数据模型Map的数据和选择一个视图进行渲染.这个模型Map对视图进行完全的抽象,在使用Thymeleaf的情况下,它将是一 ...

  4. ThinkPHP3.1 模板布局

    ThinkPHP的模板引擎内置了布局模板功能支持,可以方便的实现模板布局以及布局嵌套功能.有三种布局模板的支持方式: 第一种方式:全局配置方式 这种方式仅需在项目配置文件中添加相关的布局模板配置,就可 ...

  5. thinkphp 模板布局

    ThinkPHP的模板引擎内置了布局模板功能支持,可以方便的实现模板布局以及布局嵌套功能. 有三种布局模板的支持方式: 第一种方式:全局配置方式 这种方式仅需在项目配置文件中添加相关的布局模板配置,就 ...

  6. CSS HTML元素布局及Display属性

    本篇文章主要介绍HTML的内联元素.块级元素的分类与布局,以及dispaly属性对布局的影响. 目录 1. HTML 元素分类:介绍内联元素.块级元素的分类. 2. HTML 元素布局:介绍内联元素. ...

  7. [WPF系列]-数据邦定之DataTemplate 根据对象属性切换模板

      引言 书接上回[WPF系列-数据邦定之DataTemplate],本篇介绍如何根据属性切换模板(DataTemplate)   切换模板的两种方式:   使用DataTemplateSelecto ...

  8. Flex布局教程及属性速查

    一.Flex布局介绍 伸缩盒模型(flexbox)是一个新的盒子模型,意为"弹性布局",用来为盒状模型提供最大的灵活性,主要优化了UI布局.Flexbox的功能主要包手:简单使用一 ...

  9. thinkphp多模板布局设置!!

    首先开启模板布局要在配置文件添加: 'LAYOUT_ON'=>true, 'LAYOUT_NAME'=>'layout', 如果需要设置多个布局模板,就要先关闭上面的LAYOUT_ON,也 ...

随机推荐

  1. python笔记-用python解决小学生数学题【转载】

    本篇转自博客:上海-悠悠 原文地址:http://www.cnblogs.com/yoyoketang/tag/python/ 前几天有人在群里给小编出了个数学题: 假设你有无限数量的邮票,面值分别为 ...

  2. 使用windos电脑模拟搭建集群(四)web环境 linux+nginx+jdk+tomcat

    1.使用ansible的playbook自动安装两台web主机的nginx 1.配置模块 主机清单 2.创建 playbook目录并编写安装nginx的playbook mkdir -p playbo ...

  3. [BZOJ3211]花神游历各国&&[BZOJ3038] 上帝造题的七分钟2 树状数组+并查集

    3211: 花神游历各国 Time Limit: 5 Sec  Memory Limit: 128 MBSubmit: 4057  Solved: 1480[Submit][Status][Discu ...

  4. OpenCV和Boost C++库的安装

    关于一般的安装步骤,此博客给出了详细的OpenCV的安装.一个步骤也不要落下,应该是不会出问题的. 主要的坑在Boost. 不知什么原因,我的电脑装boost_1_62_0-msvc-14.0-64, ...

  5. Codeforces Round #109 (Div. 2) A. I_love_%username%【打擂台算法/满足当前数字在已经出现的数字的最大值和最小值之间的个数】

    A. I_love_%username% time limit per test 2 seconds memory limit per test 256 megabytes input standar ...

  6. hiho一下第130周 后缀自动机二·重复旋律7

    后缀自动机四·重复旋律7 时间限制:15000ms 单点时限:3000ms 内存限制:512MB 描述 小Hi平时的一大兴趣爱好就是演奏钢琴.我们知道一段音乐旋律可以被表示为一段数构成的数列. 神奇的 ...

  7. socket 和 webservice 的区别和比较

    时间紧迫,我就直奔主题. 目前需要说服客户使用webservice 而不是socket. 我觉得要先分别解释下什么是socket 什么是webservice..这个要我该怎么说才比较形象,让人一定就明 ...

  8. [Bzoj5285][洛谷P4424][HNOI/AHOI2018]寻宝游戏(bitset)

    P4424 [HNOI/AHOI2018]寻宝游戏 某大学每年都会有一次Mystery Hunt的活动,玩家需要根据设置的线索解谜,找到宝藏的位置,前一年获胜的队伍可以获得这一年出题的机会. 作为新生 ...

  9. Android TextView 阴影效果(投影)

    Android TextView 阴影效果(投影) 四个参数: 1 2 3 4 android:shadowColor="@color/white" android:shadowD ...

  10. The Art of Mocking

    One of the challenges developers face when writing unit tests is how to handle external dependencies ...