THYMELEAF 如何用TH:IF做条件判断

约定不等于承诺〃 2021-10-15 08:16 1116阅读 0赞

## TestController ##

增加一个布尔值数据，并且放在model中便于视图上获取

package com.how2java.springboot.web;
    import java.util.ArrayList;
    import java.util.Date;
    import java.util.List;
     
    import org.springframework.stereotype.Controller;
    import org.springframework.ui.Model;
    import org.springframework.web.bind.annotation.RequestMapping;
     
    import com.how2java.springboot.pojo.Product;
      
    @Controller
    public class TestController { 
      
        @RequestMapping("/test")
        public String test(Model m) { 
            String htmlContent = "<p style='color:red'> 红色文字</p>";
            Product currentProduct =new Product(5,"product e", 200);
            boolean testBoolean = true;
             
            m.addAttribute("htmlContent", htmlContent);
            m.addAttribute("currentProduct", currentProduct);
            m.addAttribute("testBoolean", testBoolean);
             
            return "test";
        }
    }

## 步骤 5 : ##

test.html  
Thymeleaf 的条件判断是 通过 th:if 来做的，只有为真的时候，才会显示当前元素

如果testBoolean 是 true ，本句话就会显示

取反可以用not, 或者用th:unless.

取反 ，所以如果testBoolean 是 true ，本句话就不会显示

unless 等同于上一句，所以如果testBoolean 是 true ，本句话就不会显示

除此之外，三元表达式也比较常见

<!DOCTYPE HTML>
    <html xmlns:th="http://www.thymeleaf.org">
    <head>
        <title>hello</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link rel="stylesheet" type="text/css" media="all" href="../../webapp/static/css/style.css"th:href="@{/static/css/style.css}"/>
        <script type="text/javascript" src="../../webapp/static/js/thymeleaf.js" th:src="@{/static/js/thymeleaf.js}"></script>
         
        <style> h2{ text-decoration: underline; font-size:0.9em; color:gray; } </style>       
    </head>
    <body>
     
    <div class="showing">
        <h2>条件判断</h2>
        <p th:if="${testBoolean}" >如果testBoolean 是 true ，本句话就会显示</p>
        <p th:if="${not testBoolean}" >取反 ，所以如果testBoolean 是 true ，本句话就不会显示</p>
        <p th:unless="${testBoolean}" >unless 等同于上一句，所以如果testBoolean 是 true ，本句话就不会显示</p>
        <p th:text="${testBoolean}?'当testBoolean为真的时候，显示本句话，这是用三相表达式做的':''" ></p>
    </div>
     
    <div class="showing">
        <h2>显示 转义和非转义的 html 文本</h2>
        <p th:text="${htmlContent}" ></p>
        <p th:utext="${htmlContent}" ></p>
    </div>
     
    <div class="showing">
        <h2>显示对象以及对象属性</h2>
        <p th:text="${currentProduct}" ></p>
        <p th:text="${currentProduct.name}" ></p>
        <p th:text="${currentProduct.getName()}" ></p>
    </div>
     
    <div class="showing" th:object="${currentProduct}">
        <h2>*{}方式显示属性</h2>
        <p th:text="*{name}" ></p>
    </div>
     
    <div class="showing">
        <h2>算数运算</h2>
        <p th:text="${currentProduct.price+999}" ></p>
    </div>
     
    <div class="showing">
        <div th:replace="include::footer1" ></div>
        <div th:replace="include::footer2(2015,2018)" ></div>
    </div>
     
    </body>
     
    </html>

步骤 6 :

## 关于真假判断 ##

不只是布尔值的 true 和 false, th:if 表达式返回其他值时也会被认为是 true 或 false，规则如下:

boolean 类型并且值是 true, 返回 true  
数值类型并且值不是 0, 返回 true  
字符类型(Char)并且值不是 0, 返回 true  
String 类型并且值不是 “false”, “off”, “no”, 返回 true  
不是 boolean, 数值, 字符, String 的其他类型, 返回 true

值是 null, 返回 false  
步骤 7 :

## 重启测试 ##

重新启动Application.java, 然后访问如下地址测试：

[http://127.0.0.1:8080/thymeleaf/test][http_127.0.0.1_8080_thymeleaf_test]

即可看到如图所示的效果。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpa3VucGVuZzY2NTYyMDE_size_16_color_FFFFFF_t_70]

[http_127.0.0.1_8080_thymeleaf_test]: http://127.0.0.1:8080/thymeleaf/test
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpa3VucGVuZzY2NTYyMDE_size_16_color_FFFFFF_t_70]: /images/20211015/81cbb3c452e342d28a9c9a1338300c80.png