引入Thymeleaf:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<link th:href="@{bootstrap/css/bootstrap.css}" rel="stylesheet"/>
<link th:href="@{bootstrap/css/bootstrap-theme.css}" rel="stylesheet"/>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<title>Index</title>
</head>
<body>
Welcome!
</body>
</html>

引用Web静态资源:

<link th:href="@{bootstrap/css/bootstrap.css}" rel="stylesheet"/>
<link th:href="@{bootstrap/css/bootstrap-theme.css}" rel="stylesheet"/>

访问model(${}):

<div class="panel-body">
<span th:text="${person.name}"></span>
<span th:text="${person.age}"></span>
</div>

model迭代访问(th:each指令进行迭代,person为迭代元素,${people}访问people这个model):

<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">访问model列表</h3>
</div>
<div class="panel-body">
<ul class="panel-group">
<li class="list-group-item" th:each="person:${people}">
<span th:text="${person.name}"></span>
<span th:text="${person.age}"></span>
</li>
</ul>
</div>
</div>

数据判断(th:if指令进行判断,支持如 >、< 等类型的比较条件,同时支持SpringEL):

<div th:if="${not #lists.isEmpty(people)}">内容</div>

在JavaScript中访问model有些不同,形如 [[${}]]。通过th:inline,才可以访问model):

<script th:inline="javascript">
$(function () {
var person = [[${person}]];
console.log(person.name + "/" + person.age);
});
</script>

Thymeleaf 模板引擎技术的更多相关文章

  1. Spring Boot2(五):使用Spring Boot结合Thymeleaf模板引擎使用总结

    一.Thymeleaf概述 一般来说,常用的模板引擎有JSP.Velocity.Freemarker.Thymeleaf . SpringBoot推荐的 Thymeleaf – 语法更简单,功能更强大 ...

  2. Smarty模板引擎技术二

    Smarty模板引擎技术 内建函数 include_php内建函数 作用:载入一个php文件,将载入的文件的内容赋值给一个变量   注意:该内建函数只能在2.0中使用,如果使用的话,必须得实例化Sma ...

  3. Smarty模板引擎技术

    Smarty模板引擎技术 什么是模板引擎? 什么是Smarty模板引擎? 为何选择Smarty模板引擎? 如何使用Smarty模板引擎? 一.历史背景 场景一:回顾之前编写PHP项目的方式 //链接数 ...

  4. (二)SpringBoot基础篇- 静态资源的访问及Thymeleaf模板引擎的使用

    一.描述 在应用系统开发的过程中,不可避免的需要使用静态资源(浏览器看的懂,他可以有变量,例:HTML页面,css样式文件,文本,属性文件,图片等): 并且SpringBoot内置了Thymeleaf ...

  5. 【Springboot】Springboot整合Thymeleaf模板引擎

    Thymeleaf Thymeleaf是跟Velocity.FreeMarker类似的模板引擎,它可以完全替代JSP,相较与其他的模板引擎,它主要有以下几个特点: 1. Thymeleaf在有网络和无 ...

  6. 三、thymeleaf模板引擎构建前台html, 后台使用 ModelAndView 和 Model 模型

    项目源码:https://github.com/y369q369/springBoot.git      ->     thymeleaf 私聊QQ: 1486866853 1.pom.xml中 ...

  7. SpringBoot使用thymeleaf模板引擎

    (1).添加pom依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactI ...

  8. Spring Boot 2.0 整合Thymeleaf 模板引擎

    本节将和大家一起实战Spring Boot 2.0 和thymeleaf 模板引擎 1. 创建项目 2. 使用Spring Initlizr 快速创建Spring Boot 应用程序 3. 填写项目配 ...

  9. Thymeleaf模板引擎的初步使用

    在springboot中,推荐使用的模板引擎是Thymeleaf模板引擎,它提供了完美的Spring MVC的支持.下面就简单的介绍一下Thymeleaf模板引擎的使用. 在controller层中, ...

随机推荐

  1. c# 定义委托和使用委托(事件的使用)

    使用委托时要先实例化,和类一样,使用new关键字产生委托的新实例,然后将一个或者多个与委托签名匹配的方法与委托实例关联.随后调用委托时,就会调用所有与委托实例关联的方法. 与委托关联可以是任何类或者结 ...

  2. C#获取驱动器盘符

    一.使用ManagementObjectSearcher类 static void Main(string[] args) { SelectQuery selectQuery = new Select ...

  3. RBAC

    什么是rbac? -- 基于角色的权限控制  Role-Based Access Control 一个url就代表一个权限 // url分配给角色,角色分配给用户 -- 6个model,4张表 菜单表 ...

  4. jQuery实现无刷新切换主题皮肤功能

    主题皮肤切换功能在很多网站和系统中应用,用户可以根据此功能设置自己喜欢的主题颜色风格,增强了用户体验.本文将围绕如何使用jQuery实现点击无刷新切换主题皮肤功能. 查看演示DEMO:https:// ...

  5. 2019/3/20 wen 流程控制

  6. Docker学习笔记之通过 Dockerfile 创建镜像

    0x00 概述 由于 Docker 镜像的结构优势,使它的占用空间远小于普通的虚拟机镜像,而这就大幅减少了 Docker 镜像在网络或者其他介质中转移所花费的时间,进而提高了我们进行迁移部署的效率.不 ...

  7. Linux 添加网卡

    Linux 添加网卡 1.写入网卡配置 vim /etc/sysconfig/network-scripts/ifcfg-eth1 # 网卡名字 DEVICE=eth1 # 网卡类型 TYPE=Eth ...

  8. 翻译 Improved Word Representation Learning with Sememes

    翻译 Improved Word Representation Learning with Sememes 题目 Improved Word Representation Learning with ...

  9. 接口自动化(atp,utp)

    atp:数据驱动 utp:代码驱动 pip install -r file.txt #安装文件里面有的模块 pip freeze > file.txt #导出你已经安装好的第三方模块

  10. Oracle Redo log 状态及工作原理解析

    Oracle重做日志(redo log)是用来记录操作条目,用于数据库数据恢复.为了提高效率,oracle通常建议设置三组redo log.本文将对重做日志组的状态以及多种状态之间切换做解析,力求掌握 ...