zoukankan      html  css  js  c++  java
  • 1.Thmeleaf模板引擎

    1.Thmeleaf的基本语法

    大部分的Thmeleaf表达式都直接被设置到HTML节点中,作为HTML节点的一个属性存在,这样同一个模板文件既可以使用浏览器直接打开,也可以放到服务器中用来显示数据,并且在样式上基本不会存在差异。

    2.Thmeleaf支持的模板类型

    2.1 HTML模板

    <input type="text" th:value="angus">
    

     上面这种情况,HTML模式并不会抛出异常,因为Thmeleaf并不会进行严格的认证,但对一些明显的格式错误会抛出异常。如:

    <input type="text" th:value="angus"
    

    2.2 XML模板

     Thmeleaf在处理xml时只会对文档进行形式上的检查,而不会进行实质型的检查。如xml文件中的节点没有关闭。

    2.3 Thmeleaf API

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

    2.3.1 处理HTML

    按照一定的语法规则将逻辑写入HTML页面,然后再把这些"加工"过的HTML字符串交给thmeleaf去处理,Thmeleaf处理器会处理他们,最后输出真正的,被渲染的html.

    2.3.2 变量处理

    <input type="text" th:value="${data.name"} />

    上面的模板中,th:value属性来展示data对象的name属性。

    2.3.3 遍历集合

    <table>
    <tr th:each="data:${datas}">
      <td th:text="${data.name}">Angus</td>
    </tr>
    </table>

    使用th:each属性进行数据遍历,节点变量为data,在td中使用td:text将data的name属性进行输出

    3.配置Thmeleaf

    在配置文件application.properties文件中配置Thmeleaf

    spring.thmeleaf.mode=HTML #模板模式,默认为html5
    spring.thmeleaf.prefix=classpath:/templates/ #模板前缀,默认为classpath:/templates/
    spring.thmeleaf.suffix=.html #模板后缀
    spring.thmeleaf.cache:true #是否打开模板配置,默认为true
    spring.thmeleaf.check-template;true #是否处理模板前检查其是否存在,默认为true
    spring.thmeleaf.check-template-location:true #是否检查模板位置,默认为true.
    spring.thmeleaf.content-type:text/html #默认的content-type值
    spring.thmeleaf.enabled:true #是否开启视图解析,默认为true

    4.静态资源处理

    4.1 引入css

    <link rel="stylesheet" type="text/css" th:href="@{/common.css}" /> 

    默认位置是/static/

    4.2 引入javascript

    <script type="text/javascript" src="../js/test.js th:src="@{/js/test.js}"

    5.文本处理

     在thmeleaf中,外部的文本片段通常被称为message,通常保存在properties文件里面,因此每一个文本信息都有一个key作为标识。

    <span th:text="#{page.myText}">This is propertype text.<span>

    在配置文件中是如下内容

    page.myText=This is config text

    获取变量中的属性:

    <span th:text="${user[‘parent']['age']}"></span>

    获取List中的第一个元素

    <span th:text="${users[0].name}'></span>

    获取Map中的元素:

    <span th:text="${userMap['key1'].name"></span>

    获取数组中的元素

    <span th:text="${userArr[1].name}"></span>
    

    链接表达式

    Thmeleaf的链接表达式

    @{......}
    
    <a href="view.html" th:href="@{/user/details(id=${user.id},name=${user.name})}" th:text="${user.name}"></a>
    
    <a href="view.html" th:href="@{/user/{userId}" th:text="${user.name}"></a>
    

    5.themeleaf的内置对象

    5.1 #ctx :表示模板引擎上下文对象

    5.2 #vars 模板引擎上下文对象

    5.3 #locale 在全局上下文中维护的java.util.Locale对象

    5.4 #request 表示HttpServletRequest对象

    <span th:text="${#request.getAttribute('name')}"></span>
    <span th:text="${#session.getAttribute('name2')}"></span>
    <span th:text="${#servletContext.getAttribute('name3')}"></span>
    

    5.5 #response 表示HttpServletResponse对象

    5.6 #session 表示HttpSession对象

    5.7 #servletContext 表示ServletContext对象

    6.Themeleaf的内置变量

    1.session #session属性 

    2.param #访问请求参数

    3.application 

    <span th:text="${session.sesData}"></span>
    <span th:text="${param.userName"></span>
    <span th:text="${reqData}"></span> //request所有属性,都可以直接使用${myAttribute}来访问 
    

    7.数字对象

    1.整数格式化

    formatInteger(num,digits):第一个参数是处理的整数,第二个参数用于设置最少的整数位数。

    arrayFormatInteger(num,digits)

    listFormatInteger(number,digits)

    setFormatInteger(numbers,digits)

    8.字符串对象

    在模板中使用#strings表示org.thmeleaf.expression.String对象。

    <div th:text="#strings.toString(user)"></div>
    <div th:text="#strings.length(user)"></div>
    

    非空判断与默认值处理

    #strings提供了isEmpty与defaultString方法,用来字符串的非空判断与默认值处理

    包含判断

    <div th:text="${#strings.inexOf('abcde','z')}"></div>
    <div th:text="${#string.substring('abcde',1,3)}"></div>
    <div th:text="${#string.substringAfter('abcde','a')}"></div>
    <div th:text="${#string.substringBefore('abcde','c')}"></div>
    <div th:text="${#string.replace('abcde','c','1')}"></div>

    9.日期对象

    使用#datas或者#calendars这两个日期对象来处理日期

    format(Date date)

    formatISO(Date date)

    formatISO(Date date,String pattern)

    <div th:text="${#datas.format(date)}"></div>
    <div th:text="${#datas.formatISO(date)}"></div>
    <div th:text="${#datas.format(date,'yyyy-MM-dd HH:mm:ss)}"></div>
    

      

  • 相关阅读:
    UVA 10618 Tango Tango Insurrection
    UVA 10118 Free Candies
    HDU 1024 Max Sum Plus Plus
    POJ 1984 Navigation Nightmare
    CODEVS 3546 矩阵链乘法
    UVA 1625 Color Length
    UVA 1347 Tour
    UVA 437 The Tower of Babylon
    UVA 1622 Robot
    UVA127-"Accordian" Patience(模拟)
  • 原文地址:https://www.cnblogs.com/cainame/p/11445642.html
Copyright © 2011-2022 走看看