Thymeleaf中th:each及th:if使用方法解析

2024-10-18 07:01:23

一、th:each

作用：用于遍历controller层发送过来的集合。

例：

Controller代码：

@Controller
public class HelloController {
  @RequestMapping("/success")
  public String success(Map<String,Object> map){
    map.put("users", Arrays.asList("张三","李四","王五"));
    return "success";
  }
}

下面我们通过th:each属性在html页面将其遍历显示出来

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <h4 th:text="${user}" th:each="user:${users}"></h4>
</body>
</html>

讲解：

th:each="user:${users}"

　　其中${users}是将取出名为users的List集合，每次遍历取出List集合中的一个元素赋值给user

注意：th:each每次遍历都会生成一个包含它的标签，如我们举的这个例子，users中一共有三个元素，所以会遍历三次，每次都会生成一个h4标签

二、th:if

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

<p th:if="${testBoolean}" >如果testBoolean 是 true ，本句话就会显示</p>

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

<p th:if="${not testBoolean}" >取反，所以如果testBoolean 是 true ，本句话就不会显示</p>
<p th:unless="${testBoolean}" >unless 等同于上一句，所以如果testBoolean 是 true ，本句话就不会显示</p>

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

<p th:text="${testBoolean}?'当testBoolean为真的时候，显示本句话，这是用三相表达式做的':''" >

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

thymeleaf实现th:each双重多重嵌套功能

博主最近在做一个个人的博客网站,准备用 thymeleaf 实现一个动态加载一二级文章分类的功能,效果如下: 后台实体类代码如下: /** * @author 曲健磊 * @date 2019-08-22 20:28:18 * @description 一级分类实体类 */ public class CateVO { /** * 一级分类id */ private Integer cate1Id; /** * 一级分类名称 */ private String cate1Name; /** * 该
SpringBoot使用thymeleaf模板过程解析

这篇文章主要介绍了SpringBoot使用thymeleaf模板过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1.导入依赖  <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</art
springboot+thymeleaf+druid+mybatis 多模块实现用户登录功能

项目代码:https://github.com/bruceq/supermarket 项目结构: 依赖关系: common:公共层,无依赖 dao:数据层,依赖common service:服务层,依赖dao.common web:应用层,依赖dao.common.service 注:启动类在web层中父依赖pom <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http:/
Spring boot+mybatis+thymeleaf 实现登录注册增删改查功能的示例代码

本文重在实现理解,过滤器,业务,逻辑需求,样式请无视.. 项目结构如下 1.idea新建Spring boot项目,在pom中加上thymeleaf和mybatis支持.pom.xml代码如下 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3
Spring Boot Thymeleaf实现国际化的方法详解

前言开发传统Java WEB工程时,我们可以使用JSP页面模板语言,但是在SpringBoot中已经不推荐使用了.SpringBoot支持如下页面模板语言 Thymeleaf FreeMarker Velocity Groovy JSP 上面并没有列举所有SpringBoot支持的页面模板技术.其中Thymeleaf是SpringBoot官方所推荐使用的,下面来谈谈Thymeleaf实现应用国际化方法. ps:当然现在开发基本上是前后端分离了,但是难免需要维护遗留项目或没有条件前后端分离的团队
Spring boot2+jpa+thymeleaf实现增删改查

一.pom.xml引入相关模块web.jpa.thymeleaf.oracle: <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <groupId>org.springframework.boot
SpringBoot引入Thymeleaf的实现方法

1.Thymeleaf简介 Thymeleaf是个XML/XHTML/HTML5模板引擎,可以用于Web与非Web应用 Thymeleaf的主要目标在于提供一种可被浏览器正确显示的.格式良好的模板创建方式,因此也可以用作静态建模,Thymeleaf的可扩展性也非常棒.你可以使用它定义自己的模板属性集合,这样就可以计算自定义表达式并使用自定义逻辑,Thymeleaf还可以作为模板引擎框架. 2.引入Thymeleaf 引入依赖在maven(pom.xml)中直接引入: <dependency>
Thymeleaf对象的使用之基本对象实例解析

Thymeleaf中有许多内置对象,可以在模板中实现各种功能. 下面有几个基本对象. Web对象常用有:request.session.servletContext. Thymeleaf提供了几个内置变量param.session.application,分别可以访问请求参数.session属性.application属性. 其中request的所有属性可以直接使用 ${属性名} 访问. 备注:内置对象与内置变量是两个概念,内置对象使用"${#对象}"形式,内置变量则不需要"
Thymeleaf中th:each及th:if使用方法解析

一.th:each 作用:用于遍历controller层发送过来的集合. 例: Controller代码: @Controller public class HelloController { @RequestMapping("/success") public String success(Map<String,Object> map){ map.put("users", Arrays.asList("张三","李四&qu
Python中的四种交换数值的方法解析

这篇文章主要介绍了Python中的四种交换数值的方法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下交换两个变量的值方法,这个面试题如果只写一种当然很简单,没什么可以说的. 今天这个面试是问大家有几种办法来实现交换两个变量的值. 在没开始看具体答案前,你可以先想想看下面分别来说说这几种方法方法一通过新添加中间变量temp的方式,这个方法是最简单的,每个语言都适用. 方法二 Python独有的方法,一行代码就能搞定,直接将两个变量放到元
VUE中的export default和export使用方法解析

目录 export default和export的区别 export default简单示例注意: 代码示例 export default和export的区别 export主要用于对外输出本模块变量的接口,一个文件就可以被理解为一个模块.export就是导出. import就是在一个模块中加载另一个含有export接口的模块, import就是导入. export default和export都能导出一个模块里面的常量,函数,文件,模块等,在其它文件或模块中通过import来导入常量,函数,文
vue中methods、mounted等的使用方法解析

目录 methods.mounted的使用方法 vue生命周期(methods.mounted) 1.什么是生命周期 2.钩子函数 3.Vue生命周期之初始化阶段 methods.mounted的使用方法 created:html加载完成之前,执行.执行顺序:父组件-子组件 mounted:html加载完成后执行.执行顺序:子组件-父组件 methods:事件方法执行. watch:去监听一个值的变化,然后执行相对应的函数. computed:computed是计算属性,也就是依赖其它的属性计算
ui-router中使用ocLazyLoad和resolve的具体方法

1.AngularJS按需加载 AngularJS主要应用开发SPA(Single Page Application)项目,所以在小型项目中,services.filters和controllers都在index.html中加载.Google给的AngularJS官方的angular-seed和angular-phonecat都是这样. 对于复杂一点,大型的项目,如果所有的内容一开始就加载,对首页的性能影响比较大,即使静态javascript文件使用CDN,对性能还是有很大的影响.所有需要引入按
AngularJS中监视Scope变量以及外部调用Scope方法

在AngularJS中,有时候需要监视Scope中的某个变量,因为变量的改变会影响一些界面元素的显示.有时,也希望通过jQuery调用Scope的某个方法. 比如以下场景: <div> <button id="jQBtn">jQ Button</button> </div> <div id="ngSection" ng-controller="NGCtrl"> <input typ
AngularJS中控制器函数的定义与使用方法示例

本文实例讲述了AngularJS中控制器函数的定义与使用方法.分享给大家供大家参考,具体如下: HTML正文: <body ng-app="myApp" ng-controller="myCtrl"> <h2>AngularJS函数绑定</h2> <textarea ng-model="message" cols="40" rows="10"></tex
VMware中让CentOS利用桥接上网的方法教程

如何选择正确的方式上网,直白地说,就是以下几点: 要使虚拟机能连接互联网,并且外部网络或局域网能访问到虚拟机(独立公网 IP 或局域网 IP),使用桥接模式要使虚拟机能连接互联网,但是不在意虚拟机与宿主机是否能通信(比如连接 SSH),外部网络不能访问虚拟机,使用 NAT 模式要使虚拟机不能连接互联网,但是需要虚拟机与宿主机相互通信,使用 HOST-ONLY 模式这里记录下在 VMware 中使 CentOS 利用桥接上网的方法(其实网上方法是可行的-) 第一步:设置 VMware 在 V
asp.net中Timer无刷新定时器的实现方法

本文实例讲述了asp.net中Timer无刷新定时器的实现方法.Timer控件要实现无刷新,得用到ajax技术,这里使用VS2008自带的ajax技术. 首先得添加一个ScriptManager控件,然后再添加一个UpdatePanel用于存放Timer控件内容的,就可以实现无刷新了.下面是详细的内容: 一.前台代码如下: <form id="form1" runat="server"> <asp:ScriptManager ID="
PHP中file_put_contents追加和换行的实现方法

在PHP的一些应用中需要写日志或者记录一些信息,这样的话.可以使用fopen(),fwrite()以及 fclose()这些进行操作.也可以简单的使用file_get_contents()和file_put_contents(). file_put_contents()写文件.默认的是重新写文件,也就是会替换原先的内容.追加的话使用参数FILE_APPEND. 以追加形式写入内容当设置 flags 参数值为 FILE_APPEND 时,表示在已有文件内容后面追加内容的方式写入新数据: FIL

Thymeleaf中th:each及th:if使用方法解析

相关推荐

随机推荐