变量表达式 ${...}
选择变量表达式 * {...}
消息表达式 #{...}
链接网址表达式 @{...}
片段表达式 ~{....}
- 1 转义符号与不转义符号
th:utext 是不进行转义的是原样输出的,th:text 会把 < > 转义处理 成 > 成<
model.addAttribute("content","这是一个<font style=\"color:red\">富文本</font>");
<p th:text="${content}"></p>
<p th:utext="${content}"></p>
image.png
- 2循环迭代
迭代中的属性有 index (0开始),count(1开始),size(总数), iter(当前迭代对象),even/odd (奇偶数判断),first ,last
list
<tr th:each="user,iter : ${users}" th:class="${iter.odd}? 'success' : 'danger'">
<td th:text="${user.name}"></td>
<td th:text="${user.age}">测试2</td>
<td th:text="${user.sex}">测试3</td>
</tr>
map
<tr th:each="map : ${map}">
<td th:text="${map.key}"></td>
<td th:text="${map.value}"></td>
</tr>
- 3,文本追加
<p th:text="'内容'+${add}">
等价与
<p th:text="|内容${add}|">
- 4,运算符
+ \ - * / %
<p th:text="(5 + 4) * 10 / 30 + 200">
*5条件判断与比较符号
比较符合支持
gt >
ge >=
le <=
!
eq ==
neq/ne !=
<tr th:each="user,iter : ${users}" th:class="${iter.odd}? 'success' : 'danger'">
<td th:text="${user.name}"></td>
<td th:text="${user.age}">测试2</td>
<td th:text="${user.sex}">测试3</td>
<td th:if="${user.age} ge 18">成年人</td>
<td th:if="${user.age} lt 18">未成年人</td>
</tr>
<td th:text="${user.sex} eq 0 ? '男' : '女'">测试3</td>
th:unless 与th:if 正好相反
<td th:unless="${condition}">测试3</td>
- 6,默认表达式,可以用在判断属性值为空的时候
下图中*{name} 等价为从当前的作用对象中寻找name的属性,既从object中寻找.
<div th:object="${#httpSession.getAttribute('currentUser')}">
<p >当前用户:<span th:text="*{name}"></span></p>
<br/>
<span th:text="*{age}?:'年龄未知'"></span>
</div>
哑操作符号,当age为空时,使用_代替不做处理,显示原始文本.与上面的结果是相同的.
<span th:text="*{age}?:_">年龄未知</span>
- 7,删除片段
在模板运行时删除的
<span th:remove="all">要被删除</span>
- 8 格式化与工具类
* 格式化日期
<td th:text="${#dates.format(user.bornDate,'yyyy-MM-dd')}"></td>
创建日期
${#dates.create(year,month,day)}
格式化iso18601日期
${#dates.formatISO(date)}
得到星期
${#dates.dayOfWeek(date)}
得到秒
${#dates.millisecond(date)}
....更多请参考官网附录;
*String 工具类
${#strings.contains(name,'ez')}
${#strings.startsWith(name,'Don')}
${#strings.endsWith(name,endingFragment)}
${#strings.indexOf(name,frag)} ${#strings.substring(name,3,5)} ${#strings.substringAfter(name,prefix)} // ${#strings.substringBefore(name,suffix)} // ${#strings.replace(name,'las','ler')}
${#strings.arrayJoin(namesArray,',')}
字符串转义
${#strings.escapeXml(str)} ${#strings.escapeJava(str)} ${#strings.escapeJavaScript(str)} ${#strings.unescapeJava(str)} ${#strings.unescapeJavaScript(str)}
求和求平均数
List<Integer> numlist = new ArrayList<>();
numlist.add(3);
numlist.add(2);
numlist.add(13);
numlist.add(23);
model.addAttribute("num",numlist);
<span th:text="${#aggregates.sum(num)}"></span>
<span th:text="${#aggregates.avg(num)}"></span>
- 9,设置多种属性值;
th:text 设置的是 text 内容,
那么value怎么设置呢
使用th:value
当然还有更多....
th:id
th:class
th:attr
th:axis
th:border
th:challenge
th:class
th:codetype
th:compact
th:contextmenu
th:dir
th:enctype
th:formaction
th:formtarget
th:frameborder
th:high
th:ondurationchange
th:onerror
th:onforminput
th:oninvalid
th:for
th:formenctype
th:onfocus
th:onhashchange
th:onkeydown
.....
特殊的
th:alt-title将同时设置alt属性和title属性,在设置img属性的时候常用.
- 10, 选择表达式 * 的用法;
例子
<div th:object="${#httpSession.getAttribute('currentUser')}">
<p >当前用户:<span th:text="*{name}"></span></p>
</div>
span 标签中有选定对象既object ,所有使用* 可直接找到object的name属性,假如没有选定对象,name将从上下文中寻找属性值,如果没有选定对象,那么* 和 $的用法将一样.
- 11,设置前缀和后缀
在设置属性的时候可以不覆盖现有属性,而为现在的属性增加前后缀.
<button type="button" class="btn btn" th:attrappend="class='-success'">按钮1</button> //后追加
<button type="button" class="btn-warning" th:attrprepend="class='btn '">按钮2</button> //前追加
按钮1的class后追加了-success 由原来的btn btn >>> btn btn-success
按钮2的class后追加了btn 由原来的btn-warning >>> btn btn-warning
image.png
- 12,checked属性;
在form 表单中经常需要在页面加载的时候为元素根据条件添加checked属性;
<input type="checkbox" th:checked="${3 gt 1}" >
- 13 switch 语句
<div th:switch="${fruit}">
<p th:case="'苹果'">甜的</p>
<p th:case="'香蕉'">软的</p>
<p th:case="'西瓜'">爽的</p>
<p th:case="*">其他的</p>
</div>
- 14 声明变量
<div th:with="u=${#httpSession.getAttribute('currentUser')}">
<input type="text" th:value="${u.name}">
</div>
- 15,属性执行的优先级别
当多个属相都在同一个元素的时候,执行顺序是怎么样的呢.
1, th:insert th:replace
2, th:each
3, th:if th:unless th:switch th:case
4, th:object th:with
5, th:attr th:attrappend th:attrprepend
6, th:value th:src ...
7, th:text th:utext
8, th:fragment
9, th:remove
- 16, 如何注释
解析器级的注释,解析的时候会删除掉,可以用来删除原型中的数据
<!--/*-->
<p>
我是要被删除的
</p>
</div>
<!--*/-->
thymeleaf 注释,直接打开html看不到里面的内容,模板执行后可以看见里面的呢内容.和解析器注释相反,
<!--/*/
<p>
直接打开看不见我
</p>
</div>
/*/-->
- 17,th:block块,
唯一的一个块元素,
可以和注释配合使用
<!--/*/ <th:block th:each="user,iter : ${users}"> -/*/-->
<tr>
<td th:text="*{user.name}"></td>
<td th:text="${user.age}">测试2</td>
</tr>
<!--/*/ </th:block>-/*/-->
网友评论