文档章节

thymeleaf在工作中常用的属性及表达式使用详解(三)

二十岁以后
 二十岁以后
发布于 2017/08/07 16:30
字数 1606
阅读 284
收藏 1

1.1  thymeleaf的基础知识介绍

     1.1.1  标准表达式介绍

它们分为四类:

  • 1.变量表达式
  • 2. 选择表达式(星号表达式)
  • 3. 消息表达式(井号表达式,资源表达式)通常做国际化
  • 4.URL表达式

     1.1.2  标准表达式详解

            1.变量表达式

              变量表达式用于访问容器上下文环境中的变量,功能和JSTL中的${}相同。比如我要在Controllar中用model.addAttribute向前端传入一个对象,那么前端如何接受呢? 以下是例子。

//向前端写入一个UL的对象和ID属性
@RequestMapping("/userPower")
public String userPower(@RequestParam("id") Integer id,Model model){
	UserPower UL = us.selectUserByID(id);
    model.addAttribute("ID","10081");
	model.addAttribute("UL", UL);
	return "userPower";
	}

 前端接收代码

<input th:text="${ID}" ></input >
<input th:if="${UL.Power} == 1" >管理员</input >

  访问此页面,效果如下

JAVA代码就不解释了,很简单。解释下HTML部分,th:text=" " 和 th:if=" " 是thymeleaf的一个属性,先不做解释。其$(ID),$(UL.Power)中的"UL"是Java代码中model传来的Key值,".Power"是UserPower对象中的一个属性。

            2.星号表达式

              择表达式(星号表达式)。只要是没有选择对象,选择表达式与变量表达式的语法是完全一样的。使用th:object对象属性来绑定对象。 代码如下。

//向前端写入一个UL的参数
@RequestMapping("/userPower")
public String userPower(@RequestParam("id") Integer id,Model model){
	UserPower UL = us.selectUserByID(id);
	model.addAttribute("UL", UL);
	return "userPower";
	}

           前端接收代码

<div th:object=" ${UL}" >

<p>Name: <span th: text=" *{Name}" >张</span>. </p>

<p>LastName: <span th: text=" *{lastName}" >三</span>. </p>

<p>Address: <span th: text=" *{addr}" >北京</span>. </p>

</div>

          Html解释:首先使用th:object来邦定后台传来的UserPower对象,然后使用*来代表这个对象,后面{}中的值是此对象中的属性。

           3.消息表达式

                  消息表达式(井号表达式,资源表达式)。通常与th:text属性一起使用,指明声明了th:text的标签的文本是#{}中的key所对应的value,而标签内的文本将不会显示。就是说我们可以从.properties或yml文件中,用Key索引Value.

例子如下:HTML部分

<p th:text="#{home.language}" >This text will not be show! </p>

properties中我们自定义一个home.language的属性

home.language=这段文字将会被显示!!

访问页面,效果是英文不会被展示,展示的是属性文件中的中文。

           4.URL表达式

                    超链接url表达式。

例如:

<script th:src="@{/static/js/jquery-2.4.min.js}"></script>

 表达式简介到此为止,之后我会在写表达式在工作中使用,出现的一些问题,比如URL表达式如何代入参数,字符串的拼接等等。

      1.1.3  thymeleaf属性的介绍

     再说1.1.1的时候,出现不少如th:src、th:text等字眼,这些就是thymeleaf的属性,下面附属性,然后我会把常用的进行讲解。

  • th:action

  • th:each

  • th:field

  • th:href

  • th:id

  • th:if

  • th:include

  • th:fragment

  • th:object

  • th:src

  • th:replace

  • th:text

  • th:value

       1、th:action

        定义后台控制器的路径,类似<form>标签的action属性。 例子如下。

<form id="login" th:action="@{/login}">......</form>

        2、th:each

        这个属性非常常用,比如从后台传来一个对象集合那么我就可以使用此属性遍历输出,和jstl中的<c: forEach>类似,而且这个属性不仅可以循环集合,还可以循环数组及Map,例子如下。

    <ol>  
            <li>List类型的循环:  
                <table >  
                  <tr>  
                    <th>用户名</th>  
                    <th>用户邮箱</th>  
                    <th>超级管理员</th>  
                    <th>状态变量值:index</th>  
                    <th>状态变量值:count</th>  
                    <th>状态变量值:size</th>  
                    <th>状态变量值:current.userName</th>  
                    <th>状态变量值:even</th>  
                    <th>状态变量值:odd</th>  
                    <th>状态变量值:first</th>  
                    <th>状态变量值:last</th>  
                  </tr>  
                  <tr  th:each="user,iterStat : ${list}">  
                    <td th:text="${user.userName}">Onions</td>  
                    <td th:text="${user.email}">test@test.com.cn</td>  
                    <td th:text="${user.isAdmin}">yes</td>  
                     <th th:text="${iterStat .index}">index</th>  
                    <th th:text="${iterStat .count}">count</th>  
                    <th th:text="${iterStat .size}">size</th>  
                    <th th:text="${iterStat .current.userName}">current</th>  
                    <th th:text="${iterStat .even}">even</th>  
                    <th th:text="${iterStat .odd}">odd</th>  
                    <th th:text="${iterStat .first}">first</th>  
                    <th th:text="${iterStat .last}">last</th>  
                  </tr>  
                </table>  
            </li>  
            <li>Map类型的循环:  
                <div th:each="mapS:${map}">  
                <div th:text="${mapS}"></div>  
                </div>  
            </li>  
            <li>数组的循环:  
                <div th:each="arrayS:${arrays}">  
                <div th:text="${arrayS}"></div>  
                </div>  
            </li>  
            </ol>  

        解释一下每个参数的意义,首先th:each="user,iterStat : ${list}"中的 ${list},是后台传来的Key,user 作为接受参数接收,使用iterStat作为list下标值 (这个东西我当时好久都不知道是啥),其中useriterStat自己可以随便写。

例子中的${iterStat .index}、${iterStat .count}是iterStat的属性,其属性的含义为:
    index:当前迭代对象的index(从0开始计算)
    count: 当前迭代对象的index(从1开始计算)
    size:被迭代对象的大小
    current:当前迭代变量
    even/odd:布尔值,当前循环是否是偶数/奇数(从0开始计算)
    first:布尔值,当前循环是否是第一个

    last:布尔值,当前循环是否是最后一个

       3、th:href、th:src、th:id

     定义超链接,类似<a>标签的href 属性。value形式为@{/login}

<a  class="login" th:href="@{/login}"></a>

     用于外部资源引入,类似<script>标签的src属性,常与@{}表达式结合使用。

<script th:src="@{/static/js/jquery-2.4.min.js}"></script>

     类似html标签中的id属性。

<div class="user" th:id = "(${index})"></div>

        4、th:if

        这个属性使用也非常频繁,比如后台传来一个key,判断value的值,1为男,2为女。

<span th:if="${Sex} == 1" >
          <input type="redio" name="se"  th:value="男" />
</span>
<span th:if="${Sex} == 2">
          <input type="redio" name="se"  th:value="女"  />
</span>

        5、th:value

           类似html中的value属性,能对某元素的value属性进行赋值。

<input type="hidden" id="StartNo" name="StartNo" th:value="${StartNo}">

           6、th:text

            用于文本的显示

<input type="text" id="RealName" name="ReaName" th:text="${RealName}">

            7、th:attr

            这个属性我不是很喜欢使用,因为不够优雅。这个属性用于给HTML中某元素的某属性赋值。比如例子5我还可以写成如下形式.

<input type="hidden" id="StartNo" name="StartNo" th:attr="value=${StartNo}" >

            到此thymeleaf的基本用法就介绍完了,如果对你有帮助,希望转载传播一下。接下来我会介绍关于thymeleaf的最后一部分,是我在工作中使用的一些问题及解决方式。

© 著作权归作者所有

共有 人打赏支持
二十岁以后
粉丝 231
博文 25
码字总数 23016
作品 0
海淀
架构师
springboot(四):thymeleaf使用详解

在上篇文章springboot(二):web综合开发中简单介绍了一下thymeleaf,这篇文章将更加全面详细的介绍thymeleaf的使用。thymeleaf 是新一代的模板引擎,在spring4.0中推荐使用thymeleaf来做前端...

ityouknow
2016/09/05
0
0
springboot之thymeleaf使用详解

thymeleaf介绍 thymeleaf 是新一代的模板引擎,在spring4.0中推荐使用thymeleaf来做前端模版引擎。 简单说, Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎,它可以完全替代 JSP ...

无语年华
05/17
0
0
Spring Boot总结(9)---Thymeleaf用法大全

到这篇,基本上Spring Boot框架的各种常用功能都已经总结介绍完了。用过Spring Boot开发过项目之后,我觉得最常用和最需要总结的是两个东西,Spring Data JPA 和 Thymeleaf 语法,因为你了解...

weberweber
2017/10/12
0
0
Thymeleaf模板常用知识点

thymeleaf 是新一代的模板引擎,在spring4.0中推荐使用thymeleaf来做前端模版引擎。 thymeleaf介绍 简单说, Thymeleaf 是一个跟 Velocity、FreeMarker 类似的Java模板引擎,它可以完全替代 ...

芥末无疆
01/27
0
0
thymeleaf模板引擎基础使用(转)

刚好项目上用到这个模板引擎,记录以下基础用法。 thymeleaf介绍 简单说, Thymeleaf是一个跟Velocity、FreeMarker类似的模板引擎,它可以完全替代JSP 。相比其他的模板引擎,它有如下三个极...

easonjim
2017/09/13
0
0

没有更多内容

加载失败,请刷新页面

加载更多

OSX | SafariBookmarksSyncAgent意外退出解决方法

1. 启动系统, 按住⌘-R不松手2. 在实用工具(Utilities)下打开终端,输入csrutil disable, 然后回车; 你就看到提示系统完整性保护(SIP: System Integrity Protection)已禁用3. 输入reboot回车...

云迹
今天
3
0
面向对象类之间的关系

面向对象类之间的关系:is-a、has-a、use-a is-a关系也叫继承或泛化,比如大雁和鸟类之间的关系就是继承。 has-a关系称为关联关系,例如企鹅在气候寒冷的地方生活,“企鹅”和“气候”就是关...

gackey
今天
4
0
读书(附电子书)|小狗钱钱之白色的拉布拉多

关注公众号,在公众号中回复“小狗钱钱”可免费获得电子书。 一、背景 之前写了一篇文章 《小狗钱钱》 理财小白应该读的一本书,那时候我才看那本书,现在看了一大半了,发现这本书确实不错,...

tiankonguse
今天
4
0
Permissions 0777 for ‘***’ are too open

异常显示: @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @ WARNING: UNPROTECTED PRIVATE KEY FILE! @ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ ......

李玉长
今天
5
0
区块链10年了,还未落地,它失败了吗?

导读 几乎每个人,甚至是对通证持怀疑态度的人,都对区块链的技术有积极的看法,因为它有可能改变世界。然而,区块链技术问世已经10年了,我们仍然没有真正的用上区块链技术。 几乎每个人,甚...

问题终结者
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部