Getting started with basic grammar Thymeleaf

1 Introduction

Thymeleaf is used to develop Web and environmental projects of modern independent server-side Java template engine.
Thymeleaf main goal is to bring elegance to your development workflow natural template - HTML. Direct display correctly in the browser, and can be used as a static prototype, in order to achieve a more powerful collaboration across the development team.
With the Spring Framework module, can be free to choose according to their preferences, pluggable functional components, Thymeleaf is the ideal choice for modern HTML5 JVM Web development - although it could do more.
Spring officially supported template rendering service, are not included jsp. But Thymeleaf and Freemarker, etc., but Thymeleaf and SpringMVC view technology, and automated configuration integrated SpringBoot perfect, almost no cost, you can only use the syntax of concern Thymeleaf.

2. Preparing the Environment

Click next

Click next waiting maven import dependence

2. Quick Start

2.1

First, prepare a controller

@Controller
public class FirstController {

    @GetMapping("index1")
    public String index1(Model model){
        model.addAttribute("msg", "Hello, Thymeleaf!");
        return "index1";
    }
}

Then create a html (created under the templates in resources), namespace html adding the following, there will be grammar tips

xmlns:th="http://www.thymeleaf.org"

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>hello</title>
</head>
<body>
    <h1>Success</h1>
    <!--/*@thymesVar id="msg" type="111"*/-->
    <div th:text="${msg}"></div>
</body>
</html>

Startup project

3 basic grammar

3.1 Variables

First create entity classes

public class User {
    String name;
    int age;
    String sex;
    }

In the controller, add the following

@GetMapping("index2")
    public String index2(Model model){
        User user = new User();
        user.setName("张三");
        user.setAge(18);
        user.setSex("男");
        model.addAttribute("user",user);
        return "index2";
    }

Create a index2.html

<table class="list">
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
        </tr>
        <tr>
            <td th:text="${user.name}"></td>
            <td th:text="${user.age}"></td>
            <td th:text="${user.sex}"></td>
        </tr>
    </table>

Acquiring user data in a page

If a large amount of data that needs to use the user frequently can provide custom variables to solve:

<tr th:object="${user}">
            <td th:text="*{name}"></td>
            <td th:text="*{age}"></td>
            <td th:text="*{sex}"></td>
</tr>

3.2 operation

Arithmetic

Supported arithmetic operators:+ - * / %

<span th:text="${user.age}"></span>
<span th:text="${user.age}%2 == 0"></span>

Comparison operation

>, <, >=, <=, But>, <not used directly,

To use an alias gt (>), lt (<), ge (> =), le (<=), not (!), Also eq (==), neq / ne (! =)
Conditional Operations

Ternary operator:? The conditions for the establishment of the results: the condition is not satisfied results

3.3 cycle

th:each

<table class="list">
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
        </tr>
        <tr th:each="u : ${user}">
            <td th:text="*{u.name}"></td>
            <td th:text="*{u.age}"></td>
            <td th:text="*{u.sex}"></td>
        </tr>
    </table>

@GetMapping("index2")
    public String index2(Model model){
        List<User> user = new ArrayList<>();
        user.add(new User("张三",18,"男"));
        user.add(new User("李四",19,"男"));
        user.add(new User("王五",18,"女"));
        model.addAttribute("user",user);
        return "index2";
    }

operation result

迭代的同时，也可以获取迭代对象的状态

index，从0开始的角标
size，总元素个数
count，元素的个数，从1开始
current，当前遍历到的元素
even/odd，返回是否为奇偶，boolean值
first/last，返回是否为第一或最后，boolean值

例

<tr th:each="u,stat : ${user}">
            <td th:text="*{u.name}"></td>
            <td th:text="*{u.age}"></td>
            <td th:text="*{u.sex}"></td>
</tr>

3.4逻辑判断

th:if 或者 th:unless，两者的意思相反

<span th:if="${user.age} < 25">年轻人</span>

如果为true，则标签会渲染到页面，否则不会渲染。

3.5switch

<div th:switch="${user.role}">
  <p th:case="'teacher'">教师</p>
  <p th:case="'student'">学生</p>
  <p th:case="*">其它</p>
</div>

需要注意的是，一旦有一个th:case成立，其它的则不再判断。与java中的switch是一样的。
th:case="*"表示默认，放最后。

3.6内置对象

Thymeleaf中提供了一些内置对象，并且在这些对象中提供了一些方法，方便我们来调用。获取这些对象，需要使用#对象名来引用。

添加日期类型对象

@GetMapping("index3")
    public String index3(Model model){
        model.addAttribute("today", new Date());
        return "index3";
    }

    <p>今天是：<span th:text="${#dates.format(today,'yyyy-MM-dd')}">2019-12-17</span></p>

一些内置对象

对象	作用
`#dates`	处理java.util.date的工具对象
`#calendars`	处理java.util.calendar的工具对象
`#numbers`	用来对数字格式化的方法
`#bools`	用来判断布尔值的方法
`#arrays`	用来护理数组的方法
`#strings`	用来处理字符串的方法
`#lists`	用来处理List集合的方法
`#sets`	用来处理set集合的方法
`#maps`	用来处理map集合的方法