本文主要介绍下Thymeleaf的基本使用的语法。
1.1 基本用法
表达式 | 说明 |
---|---|
th:text | 在页面中输出值 |
th:value | 可以将一个值放入到 input 标签的 value 中 |
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thymeleaf基本使用</title>
</head>
<body>
<h1>基本使用</h1>
<h2>th:text使用</h2>
<span th:text="hello"></span><br>
<span th:text="${msg}"></span><br>
<h2>th:value使用</h2>
<input type="text" th:value="测试值"><br>
<input type="text" th:value="${msg}"><br>
</body>
</html>
@RequestMapping("/t1")
public String t1(Model model){
model.addAttribute("msg","th:text使用");
return "t1";
}
1.2 判断字符串是否为空 Thymeleaf 内置对象 注意语法: a.调用内置对象一定要用# b.大部分的内置对象都以 s 结尾 strings、numbers、dates
表达式 | 说明 |
---|---|
${#strings.isEmpty(key)} | 判断字符串是否为空,如果为空返回 true,否则返回 false |
${#strings.contains(msg,‘T’)} | 判断字符串是否包含指定的子串,如果包含返回 true,否则返回 false |
${#strings.startsWith(msg,‘a’)} | 判断当前字符串是否以子串开头,如果是返回 true,否则返回 false |
${#strings.endsWith(msg,‘a’)} | 判断当前字符串是否以子串结尾,如果是返回 true,否则返回 false |
${#strings.length(msg)} | 返回字符串的长度 |
${#strings.indexOf(msg,‘h’)} | 查找子串的位置,并返回该子串的下标,如果没找到则返回-1 |
${#strings.substring(msg,13)} ${#strings.substring(msg,13,15)} | 截取子串,用户与 jdk String 类下 SubString 方法相同 |
${#strings.toUpperCase(msg)} | 字符串转大写。 |
${#strings.toLowerCase(msg)} | 字符串转小写。 |
案例
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thymeleaf基本使用</title>
</head>
<body>
<h1>基本使用</h1>
<h2>string类型处理</h2>
<span th:text="${#strings.isEmpty(msg)}"></span>
<hr/>
<span th:text="${#strings.contains(msg,'9')}"></span>
<span th:text="${#strings.contains(msg,'t')}"></span>
<hr/>
<span th:text="${#strings.startsWith(s1,'a')}"></span>
<span th:text="${#strings.startsWith(s1,'T')}"></span>
<hr/>
<span th:text="${#strings.endsWith(s1,'a')}"></span>
<span th:text="${#strings.endsWith(s1,'g')}"></span>
<hr/>
<span th:text="${#strings.length(s1)}"></span>
<hr/>
<span th:text="${#strings.indexOf(s1,'b')}"></span>
<hr/>
<span th:text="${#strings.substring(s1,4)}"></span>
<span th:text="${#strings.substring(s1,4,6)}"></span>
<hr/>
<span th:text="${#strings.toUpperCase(s1)}"></span>
<span th:text="${#strings.toLowerCase(s2)}"></span>
<hr/>
</body>
</html>
@RequestMapping("/t2")
public String t2(Model model){
model.addAttribute("msg","th:text使用");
model.addAttribute("s1","abcdefg");
model.addAttribute("s2","AbCdEfG");
model.addAttribute("s3","abc123");
return "t2";
}
表达式 | 说明 |
---|---|
${#dates.format(key)} | 格式化日期,默认的以浏览器默认语言为格式化标准 |
${#dates.format(key,‘yyy/MM/dd’)} | 按照自定义的格式做日期转换 |
${#dates.year(key)} | 取年 |
${#dates.month(key)} | 取月 |
${#dates.day(key)} | 取日 |
案例
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thymeleaf基本使用</title>
</head>
<body>
<h1>基本使用</h1>
<h2>Date使用</h2>
<span th:text="${#dates.format(now)}"></span>
<hr>
<span th:text="${#dates.format(now,'yyyy-MM-dd')}"></span>
<hr>
<span th:text="${#dates.format(now,'yyyy-MM-dd hh:ss:mm')}"></span> <hr>
<span th:text="${#dates.format(now,'yyyy-MM-dd HH:ss:mm')}"></span> <hr>
<span th:text="${#dates.year(now)}"></span> <hr>
<span th:text="${#dates.month(now)}"></span> <hr>
<span th:text="${#dates.day(now)}"></span> <hr>
<span th:text="${#dates.dayOfWeek(now)}"></span> <hr>
<span th:text="${#dates.hour(now)}"></span> <hr>
</body>
</html>
@RequestMapping("/t3")
public String t3(Model model){
model.addAttribute("now",new Date());
return "t3";
}
表达式 | 说明 |
---|---|
th:if | if语句 |
th:switch | switch语句 |
案例
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thymeleaf基本使用</title>
</head>
<body>
<h1>基本使用</h1>
<h2>if语句</h2>
<span th:if="${sex} == '男'" >男</span>
<span th:if="${sex} == '女'" >男</span> <hr>
<h2>switch语句</h2>
<span th:switch="${id}">
<span th:case="1">ID为1</span>
<span th:case="2">ID为2</span>
<span th:case="3">ID为3</span>
</span>
</body>
</html>
@RequestMapping("/t4")
public String t4(Model model){
model.addAttribute("sex","男");
model.addAttribute("id",2);
return "t4";
}
循环遍历是我们经常要用到的功能。具体实现如下
@RequestMapping("/t5")
public String t5(Model model){
List<User> list = new ArrayList<>();
list.add(new User(1,"张三",18));
list.add(new User(2,"李四",19));
list.add(new User(3,"王五",20));
Map<String, User> map = new HashMap<>();
map.put("u1", new User(1,"张三",20));
map.put("u2", new User(2,"李四",22));
map.put("u3", new User(3,"王五",24));
model.addAttribute("map", map);
model.addAttribute("list",list);
return "t5";
}
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thymeleaf基本使用</title>
</head>
<body>
<h1>基本使用</h1>
<h2>迭代语句</h2>
<table border="1" style="border-collapse: collapse">
<tr>
<th>ID</th>
<th>Name</th>
<th>Age</th>
</tr>
<tr th:each="u : ${list}">
<td th:text="${u.id}"></td>
<td th:text="${u.username}"></td>
<td th:text="${u.userage}"></td>
</tr>
</table>
<hr>
<h2>状态变量</h2>
<table border="1" style="border-collapse: collapse">
<tr>
<th>ID</th>
<th>Name</th>
<th>Age</th>
<th>Index</th>
<th>Count</th>
<th>Size</th>
<th>Even</th>
<th>Odd</th>
<th>First</th>
<th>lase</th>
</tr>
<tr th:each="u,var : ${list}">
<td th:text="${u.id}"></td>
<td th:text="${u.username}"></td>
<td th:text="${u.userage}"></td>
<td th:text="${var.index}"></td>
<td th:text="${var.count}"></td>
<td th:text="${var.size}"></td>
<td th:text="${var.even}"></td>
<td th:text="${var.odd}"></td>
<td th:text="${var.first}"></td>
<td th:text="${var.last}"></td>
</tr>
</table>
<h2>th:each 迭代 Map</h2>
<table border="1" style="border-collapse: collapse">
<tr>
<th>ID</th>
<th>Name</th>
<th>Age</th>
</tr>
<tr th:each="maps : ${map}">
<td th:text="${maps.getKey()+':'+maps.getValue().id}"></td>
<td th:text="${maps.getKey()+':'+maps.getValue().username}"></td>
<td th:text="${maps.getKey()+':'+maps.getValue().userage}"></td>
</tr>
</table>
<th/>
</body>
</html>
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thymeleaf基本使用</title>
</head>
<body>
<h1>基本使用</h1>
<h2>三大作用域取值</h2>
request:<br>
<span th:text="${#httpServletRequest.getAttribute('req')}"></span><br>
<span th:text="${#request.getAttribute('req')}"></span><br>
<span th:text="${req}"></span><br>
<hr>
session:<br>
<span th:text="${#httpSession.getAttribute('sess')}"></span><br>
<span th:text="${#session.getAttribute('sess')}"></span><br>
<hr>
servletContext:<br>
<span th:text="${#servletContext.getAttribute('app')}"></span><br>
</body>
</html>
@RequestMapping("/t6")
public String t6(HttpServletRequest request){
request.setAttribute("req","request msg");
request.getSession().setAttribute("sess","session.sess");
request.getServletContext().setAttribute("app","servletContext msg");
return "t6";
}
URL的常用方式如下:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Thymeleaf基本使用</title>
</head>
<body>
<h1>基本使用</h1>
<h2>URL使用</h2>
<a th:href="@{http://www.baidu.com}">绝对路径</a><br/>
<a href="http://www.baidu.com">绝对路径2</a>
<hr/>
<a th:href="@{/show}">相对路径</a>
<hr/>
<a th:href="@{~/project2/resourcename}">相对于服务器的根</a>
<hr/>
<a th:href="@{/show(id=1,name=zhagnsan)}">相对路径-传参</a>
<hr/>
<a th:href="@{/path/{id}/show(id=1,name=zhagnsan)}">相对路径-传参-restful</a>
</body>
</html>