Thymeleaf常用语法
文章目录
1.导入
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
2.修改css,js,a,img
@{}
th:href="@{/asserts/css/wp-page-numbers.css}"
3.表达式嵌套
th:href="@{'/toArticle/' + ${article.getArtId()}}"
需要注意的地方,下面错误示范,不能出现多个 , 保 留 最 外 层 即 可 , 删 掉 里 面 的 {},保留最外层即可,删掉里面的 ,保留最外层即可,删掉里面的{}
th:text="${#dates.format(${article.getCreateTime()},'yyyy-MM-dd HH:mm:ss')}"
4.模板重用
<div th:replace="/commons/layout :: #branding" />
/commons/layout,#branding:指在/templates/commons/layout.html 里的id=branding 的标签
把这个标签copy进来,模板重用
5.script里使用 + 三元表达式写法 + '/号’连接表达式
<script language='javascript' th:inline="javascript">
// 需要内联才能使用th表达式
// 文章总数不足分页文章数时,总页数至少为1
var allPage = [[ ${arts_size}/${articles.size()} > 0 ? ${arts_size}/${articles.size()} : 1 ]];
var currentTag = [[ ${currentTag} ]];
var currentPage = [[ ${pageNum} ]];
// alert("allPage"+allPage);
// alert("currentTag"+currentTag);
for (var i = 1; i <= allPage; i++){
var loca = "/home/"+currentTag + "?pageNum=" + i;
var theClass = currentPage == i ? 'hightlight' : '' ;
var li = $("<li></li>").append($("<a></a>").attr("href",loca).addClass(theClass).text(i));
li.appendTo("#pageNav");
// th:class="${currentTag} == ${tag.getId()} ? 'hightlight
}
</script>
6.循环输出
循环tags集合,每个tag对象对应一个option
<select style="padding: 8px;">
<option>NONE</option>
<option th:each="tag:${tags}">[[ ${tag.getName()}]]</option>
</select>
7.自定义属性
th:attr自定义属性
<a href="javascript:void(0);" id="modify" th:attr="tagid=${tag.getId()}">编辑</a>
<script language='javascript' th:inline="javascript">
$("#modify").click(function(){
alert($(this).attr("tagid"));
});
</script>
8.时间格式化
${#dates.format(a,‘yyyy-MM-dd HH:mm:ss’)}
th:text="${#dates.format(article.getCreateTime(),'yyyy-MM-dd HH:mm:ss')}"
9.复杂表达式运算
${一个大括号外包即可}
<a href = "@{ '/home/' + ${currentTag} + '?pageNum=' + ${ arts_size % pageSize == 0 ? arts_size/pageSize : arts_size/pageSize + 1 } } "></a>