当前位置：首页 > article >正文

Spring Boot Web项目全解析：Thymeleaf语法

article 2025/2/3 16:39:25

Thymeleaf 语法：

变量表达式：
1. 变量表达式即 OGNL 表达式或 Spring EL 表达式(在 Spring 属性中也叫 model attributes)
2. 如：$(session.user.name)
3. 示例：<span th:text="${book.author.name}">
选择(星号)表达式：
1. 选择表达式很像变量表达式，不过他们用一个预先选择的对象来代替上下问变量容器(map)
2. 如：*{customer.name}
3. 被指定的 object 由 th:object 属性定义：
```
<div th:object="${book}">
    <span th:text="*{title}">··········</span>
</div>
```
文字国际化表达式：
1. 文字国际化表达式允许我们从一个外部文件获取区域文字信息(.properties)，用 key 索引 Value，还可以提供一组参数(可选)
2. 如：#{main.title}
URL 表达式：
1. URL 表达式指的是把一个有用的上下文或回话信息添加到 URL，这个了过程经常被叫做 URL 重写。不需要指定项目名字
2. 如：@{/hello/index}
3. URL 还可以设置参数：
  1. @{/hello/details(id=${orserId})}
4. 示例：
```
<form th:action="@{/hello}">
<a href="main.html" rel="external nofollow" th:href="@{/main}" rel="external">
```

表达式支持的语法：

字面：
1. 文本文字：'one text'，'Another one! '，···
2. 数字文本：1，2，3，4，···
3. 布尔文本：true，false
4. 空：null
5. 文字标记：one，sometext，main，···
文本操作：
1. 字符串连接：+
2. 文本替换：| The name is ${name} |
算数运算：
1. 二元运算：+ - * / %
布尔运算：
1. 二元运算：and，or
2. 布尔否定：！，not
比较和等价：
1. 比较： <，>，<=，>=
2. 等值运算符：==，！=
条件运算符：
1. if-the：( if) ? (then)
2. if-then-else：(if) ？(then) ：(else)
3. default：(value) ?：(defaultvalue)

示例：

'user is of type ' + (${user.isAdmin()} ? 'Administrator' : (${user.type} ?: 'Unknown'))

常用的 thymeleaf 标签：

标签检测：

模板：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <title>Title</title>
    </head>
    <body>
    <div  th:text="${hello}" th:id="${hello.toUpperCase()}">xxxx</div>
    <input th:value="${user.getUsername()}">
    <hr>
    <div th:object="${user}">
        <span th:text="*{username}"></span>

    </div>


    <a th:href="" th:if="${user.getAge() == 2}" >年龄</a>

    <a  th:class="${user.getAge() > 2}?'class1':'class2'" >年龄</a>

    <p th:if="${user.score >= 60 and user.score < 85}">B</p>
    <p th:if="${user.score < 60}">C</p>
    <p th:if="${user.score > 85}">优秀</p>


    <span th:switch="${user.gender}">
    <p th:case="1">男</p>
    <p th:case="2">女</p>
</span>


    <table>

        <tr th:each="a,aState:${uList}">
            <td th:text="${a.username}"></td>
            <td th:text="${a.password}"></td>
            <td th:text="${aState.index}"></td>
        </tr>
    </table>

    </body>
    </html>

Controller 层：

@Controller
public class HelloController {

    @RequestMapping("/success")
    public String sayHello(HttpServletRequest request, HttpServletResponse response, Model model){
        model.addAttribute("hello","任亮");
        User user = new User();
        user.setPassword("111");
        user.setUsername("renliang");
        user.setAge(11);
        user.setScore(33.0);
        user.setGender(2);
        List<User> list = new ArrayList<>();
        for(int i = 0;i<10;i++){
            User u = new User();
            u.setUsername("张三"+1);
            u.setUsername("111" + i);
            list.add(u);
        }

        model.addAttribute("user",user);
        model.addAttribute("list",list);
        return "success";

    }
}

查看全文

http://www.kler.cn/a/529987.html