引入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. urllib2 post请求方式，带cookie，添加请求头

    #encoding = utf-8 import urllib2import urllib url = 'http://httpbin.org/post'data={"name": ...

  2. let的使用 优先于闭包

    let声明的变量在{}中使用,变量的作用域限制在块级域中 举例:使用js动态给ul添加li对象并点击第几项,显示当前点击是第几个 错误代码 window.onload = function(){ va ...

  3. Javascript深入理解构造函数和原型对象

    1.在典型的oop的语言中,如java,都存在类的概念,类就是对象的模板,对象就是类的实例.但在js中不存在类的概念,js不是基于类,而是通过构造函数(constructor)和原型链(propoty ...

  4. Matlab基础部分2-数组和矩阵分析

    矩阵块操作: 矩阵尺寸改变: 矩阵的查找: 矩阵的排序: 矩阵求和: 矩阵的求积: 矩阵的差分: 全零矩阵: 单位矩阵: 随机矩阵: 伴随矩阵: 方针行列式计算: 特征值: 对角矩阵: 三角矩阵: 矩 ...

  5. <转>jmeter（六）元件的作用域与执行顺序

    本博客转载自:http://www.cnblogs.com/imyalost/category/846346.html 个人感觉不错,对jmeter讲解非常详细,担心以后找不到了,所以转发出来,留着慢 ...

  6. LINUX部署SVN服务器

    1.安装SVN服务端 yum install -y subversion 2.创建svn版本库 mkdir -p /data/svn/myproject svnadmin create /data/s ...

  7. bp暴力破解（转载）

    在kali linux系统环境下自带burpsuite软件工具. 一.打开浏览器需要先设置将代理设置为本地. 打开firefox浏览器->open menu->preferences-&g ...

  8. PHP图片裁剪与缩放示例（无损裁剪图片）

    <?php /* *exif_imagetype -- 判断一个图像的类型 *功能说明:函数功能是把一个图像裁剪为任意大小的图像,并保持图像不变形 *参数说明:输入 需要处理图片的 文件名,生成 ...

  9. Windbg解决系统蓝屏

    win10企业版连续两天遭遇系统蓝屏, 今天就各种检查,准备好好地研究一下这个问题,以下是整个过程: 首先,找到系统蓝屏时的错误日志: [计算机] --> [管理] --> [系统工具] ...

  10. netty支持的各种socketchannel实现及比较

    性能上从低到高如下: OioSocketChannel:传统,阻塞式编程. NioSocketChannel:select/poll或者epoll,jdk 7之后linux下会自动选择epoll. E ...