一、Thymeleaf简介
Thymeleaf是适用于Web和独立环境的现代服务器端Java模板引擎,能够处理HTML,XML,JavaScript,CSS甚至纯文本。简单说,就是通过特定的语法对 html 的标记做渲染。
二、常规用法
1.标准表达式语法
简单表达式:
- 变量表达式:
${...} - 链接URL表达式:
@{...}
算术运算
- 二元运算符:
+,-,*,/,% - 减号(一元运算符):
-
布尔运算:
-
- 二元运算符:
and,or 或者 &&,|| - 布尔否定(一元运算符):
!,not
- 二元运算符:
比较和平等:
-
- 比较:
>,<,>=,<=(gt,lt,ge,le) - 等号运算符:
==,!=(eq,ne)
- 比较:
条件运算符:
- 如果-则:
(if) ? (then) - 如果-则-否则:
(if) ? (then) : (else) - 默认:
(value) ?: (defaultvalue)
三、常用
1)判空(null, ‘’)
判断对象、属性字段是不是null:
<input type="radio" name="isExist" value="1" checked="checked" th:disabled="${null != info && null != info.isExist && info.isExist != ''}"> 存在问题
判断是不是为空字符串: “”
<span th:if="${#strings.isEmpty(phoneNumber)}">是否为空串</span>
2)逻辑判断(&&,||)
<span th:if="${sex != 1 && age eq 4}">判断是否相等,且比较大小</span>
3)禁用操作(th:disabled)
<input type="text" th:disabled="${userName != null && userName != ''}" >
4)select下拉选择项(遍历、迭代)
<select class="form-control k_selectpicker" name="progress" >
<option th:each="iterator,progressState : ${T(com.momoj.model.enums.productEnum).values()}"
th:value="${iterator.code}"
th:text="${iterator.desc}"
th:selected="${product.type eq iterator.code}">
</option>
</select>
5)自定义属性(th:data-type)
<input type="text" id="type" th:data-type="1" />
js可以通过 $('#type').data('type')来获取值。
6)遍历switch:开关语句(switch/case)
<td th:switch="${user.sex}">
<span th:case="0"> 女孩 </span>
<span th:case="1"> 男生 </span>
</td>
获取到sex的值,通过switch语法来判断case为0或者1,从而展示匹配到的那个span。
例如:
<td th:switch="${whetherOverdue}">
<span th:case="0">
未超期
</span>
<span th:case="1">
已超期
</span>
</td>
7)时间格式化操作(#data.format(createTime, ‘yyyy-MM-dd HH:mm’))
<td>创建时间:</td>
<td th:text="${#dates.format(createTime, 'yyyy-MM-dd HH:mm')}"></td>
8)包含(contain方法)
*字符串包含
${#strings.contains(name,'ez')}
*数组包含
${#arrays.contains(array, element)}
*集合包含
${#lists.contains(list, element)}
*map类型包含
${#maps.containsKey(map, key)}
9)内外链接符号(+)
<td th:title="${task.taskName} + '-链接符号附加内容'" th:text="${task.taskName + '-链接符号附加内容' }"></td>
10)设置标签自定义值(th:atrr)
<td th:attr="data-content=${description}" id="content">执行人员:</td>
其,获取值得方式如下:
var content = $("#content").attr("data-content");
或者
var content = $("#content").data("data-content");