引入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. python字典的排序，按key排序和按value排序---sorted()

    >>> d{'a': 5, 'c': 3, 'b': 4} >>> d.items()[('a', 5), ('c', 3), ('b', 4)] 字典的元素是成键 ...

  2. android本地数据库，微信数据库WCDB for Android 使用实例

    android本地数据库,微信数据库WCDB for Android 使用实例 Home · Tencent/wcdb Wikihttps://github.com/Tencent/wcdb/wiki ...

  3. Android开源图表图形库K线图

    Android开源图表图形库K线图 web端k线图一般使用TradingView,android原生的一般是在MPAndroidChart 基础上做开发的,目前看到一个比较好的K线开源组件是KChar ...

  4. hibernate二级缓存ehcache hibernate配置详解

    <!-----------------hibernate二级缓存ehcache------------------------->hibernate配置 <prop key=&quo ...

  5. bzoj3196 二逼平衡树

    题目链接 平衡树系列最后一题 坑啊 10s时间限制跑了9764ms...还是要学一学bit套主席树啦... 经典的线段树套treap...至于第一发为什么要TLE(我不会告诉你treap插入的时候忘了 ...

  6. Django框架----模板语法

    Django模板系统 官方文档 一.什么是模板? 只要是在html里面有模板语法就不是html文件了,这样的文件就叫做模板. 二.模板语法分类 只需要记两种特殊符号: {{  }}和 {% %} 变量 ...

  7. 爬虫之牛掰的scrapy框架

    一. Scrapy简介及安装 http://python.jobbole.com/86405/ Scrapy的详细介绍   1.简介   2.安装     1.window上安装:         先 ...

  8. HTML的简介

    1.HTML语言是做显示用的.HTML文件由浏览器来转译执行.(全站工程师:全都会.) 2.静态网页由HTML(显示).CSS(修饰).JAVAScript(简单交互)三种元素构成.3.动态网页:数据 ...

  9. IntelliJ IDEA的使用之调试方法

    不管学什么要及时复习和练习!!不然就会忘掉,有个输入输出的过程 IntelJ IDEA的使用之断点调试 1)添加断点:直接在代码的最左侧点一下就行,出现红色圈圈. 2)单步运行:mac中F7.F8有其 ...

  10. Docker学习笔记之搭建Docker运行环境

    0x00 概述 既然 Docker 是一款实用软件,我们就不得不先从它的安装说起,只有让 Docker 运行在我们的计算机上,才能更方便我们对 Docker 相关知识和使用方式的学习.得益于与商业性的 ...