Thymeleaf 常用标签、语法---2021/01/10--1.2 增加字符串截取/自定义属性名
Posted on 2020-11-29 23:29 海绵谷 阅读(351) 评论(0) 编辑 收藏 举报- 公共资源文件css、js 等统一引入示例
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:fragment="header(title,link,style)">
<meta charset="utf-8">
<title th:replace="${title}">The awesome application</title>
<!--全局通用框架样式 begin-->
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.6 -->
<link rel="stylesheet" type="text/css" th:href="@{/static/css/bootstrap.min.css}" />
<!-- Font Awesome -->
<!-- Theme style -->
<!--zTreee-->
<!--文件上传-->
<!--bootstrapTable -->
<!--日期-->
<!--select2-->
<!--全局通用框架样式 end-->
<!--/* Per-page placeholder for additional links */-->
<script type="text/javascript" th:src="@{/static/js/jquery.min.js}"></script>
<script type="text/javascript" th:src="@{/static/js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{/static/js/common.js}" ></script>
<script type="text/javascript" th:inline="javascript">
/*<![CDATA[*/
var ctxPath = /*[[@{/}]]*/ '';
/*]]>*/
</script>
<!--添加下面一句话 才能引入特有的css-->
<th:block th:replace="${link}" />
<th:block th:replace="${style}" />
<style>
.bck{
background-color: #46b8da;
padding-top:10px;
padding-bottom: 10px;
}
</style>
</head>
- 在公共头部文件里获取 项目路径,方便统一调用
<script type="text/javascript" th:inline="javascript">
/*<![CDATA[*/
var ctxPath = /*[[@{/}]]*/ '';
/*]]>*/
</script>
- 获取对象的某个属性,例如获取item的id属性
<a th:href="@{'/newsDetail?id='+${item.id}}">
- 格式化成标准日期: HH :代表24小时,hh :代表12小时制,例如将startTime转成yyyy-MM-dd HH:mm
<span th:text="${#dates.format(activity.startTime, 'yyyy-MM-dd HH:mm')}"></span>
- 日期的比较: gt(大于) lt(小于) eq(等于) !=(不等于) ==(等于),例如判断当前日期是否小于applyDeadline
<span th:if="${#dates.format(new java.util.Date().getTime(), 'yyyy-MM-dd HH:mm:ss')} lt ${#dates.format(activity.applyDeadline, 'yyyy-MM-dd HH:mm:ss')}">
- url的拼接:单个参数 以及 多个参数,item 为object
<a th:href="@{'/newsDetail?id='+${item.id}}">
<div th:href="@{/Culturecloud/dispDetail(id=${item.id},flag=${'6'})}"></div>
<a th:if="${user != null}" th:href="@{'/bgmx/'+${hotblog.id}+'?ticket='+${user.token}}" ></a>
- 加载图片地址的拼接
<img th:src="@{'/upload/activity/'+${item.activityImg}}" "javascript:this.src='../statics/images/no-pictures.png';">
- 对于list集合的判断: th:if 以及 th:unless
<div th:if="${#lists.isEmpty(heritageList)}"></div>
<div th:unless="${#lists.isEmpty(heritageList)}"></div>
- 对于list集合的循环:display 为json数据的key
<div class="item" th:each="item : ${display}"></div>
- 对于某个属性不确定值的判断: th:switch
<div class="md-img" th:switch="${{item.resourceTypeid}}">
<span th:case="1"></span>
<span th:case="2"></span>
................
</div>
<!--判断是否为0-->
<span th:if="${isfinally} == 0" ></span>
<!--判断是否为空-->
<span th:if="${object } != null"></span>
- 对于html文本的解析: th:utext
<span th:utext="${cloudworks.worksContent}"></span>
- 对于一些数学基本运算: +,-,*,/,%
<span th:text="${activity.appointmen} - ${activity.appointmen}"></span>
- 对于字符串的函数处理:book 是一个数组,3 是下标,book[3]为字符串,+ 号 为 拼接;
<span class="active" th:data="${#strings.substring(book[3],0,10)}+'@'+${book[0]['1'].stageid}" ></span>
${#strings.indexOf(name,frag)}
${#strings.substring(name,3,5)}
${#strings.substringAfter(name,prefix)}
${#strings.substringBefore(name,suffix)}
${#strings.replace(name,'las','ler')}
- 对于获取 数组->map
<sapn th:text="${book[0]['1']}></span>
- 设置自定义属性值:
<span th:data="${data.val}" id="val"></span>
<!--在js中获取:var val= $("#val").attr("data");-->
- 获取存在session里的数据
<span th:if="${session.user != null}">
<span id="userId" hidden th:text="${session.user.id}"></span>
<span id="isVolun" th:text="${session.user.isVolun}" hidden></span>
</span>
<!--类似还有application:⽤于获取应⽤程序或servlet上下⽂属性;request:直接访问与当前请求关联的-->
在标签里自定义属性值数据,例如data-val
<input class="radioChecked" th:value="${catalog.id}" th:attr="data-val=${catalog.name}" >
使用标签截取字符串
<span th:text="${#strings.abbreviate(blogs.summary,50)}"></span>
获取文本值 th:text
<a href="" th:text="'当前第'+${list.currentPage}+'页'">当前第页</a>
在标签里进行加减
<li th:if="${list.currentPage != list.totalPage && list.isMore gt 0 }">
<a th:if="${user == null}" th:href="@{'/all.vw?currentPage='+${list.currentPage + 1 }}">下一页</a>
<a th:if="${user != null}" th:href="@{'/all.vw?currentPage='+${list.currentPage + 1 }+'&ticket='+${user.token}}">下一页</a>
</li>
--本文作者:【ngLee 】
--关于博文:如果有错误的地方,还请留言指正。如转载请注明出处!如果您觉得文章对您有帮助,可以点击文章右下角【推荐】一下。您的鼓励是博主的最大动力!