zoukankan      html  css  js  c++  java
  • Template-Thymeleaf:百科

    ylbtech-Template-Thymeleaf:百科
    1.返回顶部
    1、

    Thymeleaf简介

    Thymeleaf

    Thymeleaf简介

    Thymeleaf是一个流行的模板引擎,该模板引擎采用Java语言开发,模板引擎是一个技术名词,是跨领域跨平台的概念,在Java语言体系下有模板引擎,在C#、PHP语言体系下也有模板引擎。除了thymeleaf之外还有Velocity、FreeMarker等模板引擎,功能类似。

    Thymeleaf的主要目标在于提供一种可被浏览器正确显示的、格式良好的模板创建方式,因此也可以用作静态建模。你可以使用它创建经过验证的XML与HTML模板。使用thymeleaf创建的html模板可以在浏览器里面直接打开(展示静态数据),这有利于前后端分离。需要注意的是thymeleaf不是spring旗下的。这里我们使用thymeleaf 3版本。

    第一个thymeleaf程序

    添加thymeleaf依赖
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>
    修改spring boot配置文件

    在开发阶段,建议关闭thymeleaf的缓存

    spring.thymeleaf.cache=false

    thymeleaf会对html中的标签进行严格校验,如果html标签缺少结束标签的话,thymeleaf会报错,我们可以通过下面方式去除thymeleaf的校验,添加依赖:

     <dependency>
          <groupId>net.sourceforge.nekohtml</groupId>
          <artifactId>nekohtml</artifactId>
          <version>1.9.22</version>
      </dependency> 

    在spring boot配置文件中添加下面内容:

    spring.thymeleaf.mode=LEGANCYHTML5
    创建controller准备数据
    import org.springframework.stereotype.Controller;
    import org.springframework.ui.Model;
    import org.springframework.web.bind.annotation.RequestMapping;
    
    @Controller
    public class ThymeleafController {
        @RequestMapping("/hello")
        public String helloThymeleaf(Model model) {
            model.addAttribute("name", "jack");
            return "index";
        }
    
    }
    创建html页面

    在resources/templates里面创建一个index.html,填写下面内容,注意添加这个xmlns:th="http://www.thymeleaf.org":

    <!DOCTYPE html>
    <html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"/>
        <title>Spring boot集成 Thymeleaf</title>
    </head>
    <body>
    <p th:text="${name}">Spring boot集成 Thymeleaf</p>
    </body>
    </html>

    Springboot使用thymeleaf作为视图展示的时候,我们将模板文件放置在resource/templates目录下,静态资源放置在resource/static目录下。

    表达式

    标准变量表达式

    创建用来准备数据的Controller

    @RequestMapping(value="/userInfo")
    public String userInfo (Model model) {
        User user = new User();
        user.setId(1001);
        user.setName("jack");
        user.setPhone("13711111111");
        model.addAttribute("user", user);
        model.addAttribute("hello", "helloworld");
        return "user";
    }

    创建user.html,通过th:text表达式来获取controller中返回的数据。

    <!DOCTYPE html>
    <html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8"/>
        <title>Spring boot集成 Thymeleaf</title>
    </head>
    <body>
        <table>
            <tr>
                <td th:text="${user.id}">1</td>
                <td th:text="${user.name}">a</td>
                <td th:text="${user.phone}">137</td>
            </tr>
        </table>
        <div th:text="${hello}"></div>
    </body>
    </html>
    选择变量表达式

    这里相当于是先使用th:object将user对象取出,然后在里面的th:text中获取user对象中的属性值。

    <table>
        <tr th:object="${user}">
            <td th:text="*{id}">1</td>
            <td th:text="*{name}">a</td>
            <td th:text="*{phone}">137</td>
        </tr>
    </table>
    url表达式

    将后台传入的数据拼接到url中

    <a href="info.html" th:href="@{/user/info(id=${user.id})}">参数拼接</a>
    <a href="info.html" th:href="@{/user/info(id=${user.id},phone=${user.phone})}">多参数拼接</a>
    <a href="info.html" th:href="@{/user/info/{uid}(uid=${user.id})}">restful风格</a>
    <a href="info.html" th:href="@{/user/info/{uid}/abc(uid=${user.id})}">restful风格</a>
    2、
    2.返回顶部
     
    3.返回顶部
     
    4.返回顶部
     
    5.返回顶部
    0、
    0.1、
    0.2、
    1.1、
    2、
     
    6.返回顶部
     
    warn 作者:ylbtech
    出处:http://ylbtech.cnblogs.com/
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
  • 相关阅读:
    HDU 4287 Intelligent IME 第37届ACM/ICPC天津赛区网络赛1010题 (水题)
    HDU 4267 A Simple Problem with Integers 第37届ACM/ICPC长春赛区网络赛1001题 (树状数组)
    HDU 4277 USACO ORZ 第37届ACM/ICPC长春赛区网络赛1011题(搜索)
    HDU 4099 Revenge of Fibonacci(字典树)
    HDU 2802 F(N)(简单题,找循环解)
    HDU 4282 A very hard mathematic problem 第37届ACM/ICPC长春赛区网络赛1005题 (暴力)
    HDU 4268 Alice and Bob 第37届ACM/ICPC长春赛区网络赛1002题 (贪心+multiset)
    HDU 3501 Calculation 2(欧拉函数的引申)
    HDU 4278 Faulty Odometer 第37届ACM/ICPC天津赛区网络赛1001题 (简单水题)
    HDU 4279 Number 第37届ACM/ICPC天津赛区网络赛1002题 (简单规律题)
  • 原文地址:https://www.cnblogs.com/storebook/p/10978149.html
Copyright © 2011-2022 走看看