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>
    

      

  • 相关阅读:
    Django实现组合搜索的方法示例
    MySQL一些常用命令
    Linux IPMI 安装配置实用[转载]
    注意力训练的十个方法(转来的,原著者,不要打我)
    0001:Web与Web框架
    第二天Python
    第一天Python
    那些被疯狂追求的女孩,后来怎么样了?
    Linux服务器---流量监控MRTG
    Linux基础命令---文本编辑ex
  • 原文地址:https://www.cnblogs.com/cainame/p/11445642.html
Copyright © 2011-2022 走看看