SpringBoot坚持学习第二天：Thymeleaf模版引擎

一、Thymeleaf模版引擎的使用

为了能够热部署，我们要做一些前置操作。比例引入依赖与关闭缓存。

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

关闭缓存。properties 的 spring.thymeleaf.cache=false 是关闭 Thymeleaf 的缓存，不然在开发过程中修改页面不会立刻生效需要重启，生产可配置为 true。

在 application.properties 中添加配置：

spring.thymeleaf.cache=false

（1）解析后台字符串

    @RequestMapping("/")
    public String index(ModelMap map) {
        map.put("message", "小大宇");
        return "hello";
    }

使用Thymeleaf模版的HTML，需要在 HTML 标签声明 Thymeleaf。就好比引入JSTL一样。

<html xmlns:th="http://www.thymeleaf.org">

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"></meta>
    <title>Hello</title>
</head>
<body>
<h1  th:text="${message}">Hello World</h1>
</body>
</html>

（2）拼接字符串

第一种用一对 "| string |" 来拼接字符串。后台一样在ModelMap中存储 userName的属性值。

第二种就是传统的使用 "+" 号进行拼接。

注： 是报错的，原因是逗号解析不出来。所以要把逗号放入引号内才能成功。

（3）条件判断 If/Unless

Thymeleaf 中使用 th:if 和 th:unless 属性进行条件判断。标签只有在 th:if 中条件成立时才显示，th:unless 与 th:if 恰好相反，只有表达式中的条件不成立，才会显示其内容。

语法呢，稍微有点与以前不一样。注意引号的使用。另外值得注意的是 th:href = " @{}" 这个语法。

<a th:if="${flag == 'yes'}" th:href="@{http://www.baidu.com}" }>百度</a>
<a th:unless="${flag == 'no'}" th:href="@{http://www.baidu.com}">百度2</a>

（4）FOR循环迭代

    @RequestMapping("/list")
    public String list(ModelMap map) {
        map.addAttribute("users", getUserList());
        return "list";
    }

    private List<User> getUserList() {
        List<User> list = new ArrayList<User>();
        User user1 = new User("userA", 20, "123222");
        User user2 = new User("userB", 21, "123333");
        User user3 = new User("userC", 22, "123444");
        list.add(user1);
        list.add(user2);
        list.add(user3);
        return list;
    }

其语法也就是使用 th:each标签属性，逗号之前为这次迭代的对象，iterStat 的值是后台传递的list集合。

<table>
        <tr  th:each="user,iterStat : ${users}">
            <td th:text="${user.name}">neo</td>
            <td th:text="${user.age}">6</td>
            <td th:text="${user.pass}">213</td>
            <td th:text="${iterStat.index}">index</td>
        </tr>
    </table>

（5）解析URL路径

Thymeleaf 对于 URL 的处理是通过语法@{ ... }来处理的。如果需要 Thymeleaf 对 URL 进行渲染，那么务必使用 th:href、th:src 等属性

<a th:href="@{http://www.ityouknow.com/{type}(type=${type})}">link1</a>
<a th:href="@{http://www.ityouknow.com/{pageId}/can-use-springcloud.html(pageId=${pageId})}">view</a>

上例中 URL 最后的(type=${type})表示将括号内的内容作为 URL 参数处理，该语法避免使用字符串拼接，大大提高了可读性。${type}的值从后台服务器获取。

@{/order}是 Context 相关的相对路径，在渲染时会自动添加上当前 Web 应用的 Context 名字，假设 context 名字为 app，那么结果应该是 /app/order。

以前在JSP中，为了访问服务器的根目录，一般情况下使用的是<c:url>标签。现在可以直接使用@{/oder}就能访问到/projectRoot/order。

   @RequestMapping("/url")
    public String url(ModelMap map) {
        map.addAttribute("type", "mytype");
        return "url";
    }

<body>
<a th:href="@{/order}">/order</a>
<a th:href="@{/order/{type}(type=${type})}">/order</a>
</body>

（6）三目运算符

三目运算符可以使用在 th:value中，也可以使用在 th:if 中。

gt：great than（大于）

ge：great equal（大于等于）

eq：equal（等于）

lt：less than（小于）

le：less equal（小于等于）

ne：not equal（不等于）

    @RequestMapping("/eq")
    public String eq(ModelMap map) {
        map.addAttribute("name", "neo");
        map.addAttribute("age", 30);
        map.addAttribute("flag", "yes");
        return "eq";
    }

    <input th:value="${name}"/>
    <input th:value="${age gt 30 ? '中年':'年轻'}"/>
    <a th:if="${flag eq 'yes'}"  th:href="@{http://www.baidu.com}">百度</a>

（7）SWITCH CASE 选择

    @RequestMapping("/switch")
    public String switchcase(ModelMap map) {
        map.addAttribute("sex", "woman");
        return "switch";
    }

<div th:switch="${sex}">
    <p th:case="'woman'">她是一个姑娘...</p>
    <p th:case="'man'">这是一个爷们!</p>
    <!-- *: case的默认的选项 -->
    <p th:case="*">未知性别的一个家伙。</p>
</div>