引入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. jenkins3

    Jenkins是基于java开发的. GitHub Git (熟练使用) Doocker (了解) Jenkins (熟练使用) Django (熟练使用) Angularjs (了解) Sentry ...

  2. Django之富文本编辑器

    1.在虚拟环境中安装包. pip install django-tinymce==2.6.0 2.在配置文件中INSTALLED_APPS注册 3.配置富文本编辑器的宽高 4.配置编辑器url.

  3. react复习总结（2）--react生命周期和组件通信

    这是react项目复习总结第二讲, 第一讲:https://www.cnblogs.com/wuhairui/p/10367620.html 首先我们来学习下react的生命周期(钩子)函数. 什么是 ...

  4. mycat中schema.xml的一些解释

    <?xml version="1.0"?> <!DOCTYPE mycat:schema SYSTEM "schema.dtd"> &l ...

  5. kivy中文

    from kivy.config import Config Config.set('kivy', 'default_font', [ 'msgothic', 'DroidSansFallback.t ...

  6. JDK常用命令（二）jstack

    Dump Dump文件是进程的内存镜像.可以把程序的执行状态通过调试器保存到dump文件中.Dump文件一般用来给驱动程序编写人员调试驱动程序用的,在java中用来分析正在运行的程序在内存中的堆栈信息 ...

  7. GitHub客户端使用

    GitHub客户端使用 我们今天先讲解一下Github for windows(客户端)的使用方法,之后我们会以一个实例一步一步的来讲解Github. Github for windows(客户端)是 ...

  8. kali linux web程序集简述

    Burp Suite Burp Suite是一个用于执行Web应用程序安全性测试的集成平台. 它的各种工具可以无缝地协同工作,支持整个测试过程,从应用程序攻击面的初始映射和分析,到查找和利用安全漏洞. ...

  9. 变参标准函数的重新封装，如printf

    方法一: #include <stdio.h> #include <stdarg.h> void my_trace(const char *cmd, ...) { printf ...

  10. 【Python023/024--递归】

    一.递归--汉诺塔 1.有三个轴(x,y,z),64个盘子,把所有盘子从X轴移动到Z轴,要求移动到Z轴的盘子从上到下排序 思路: 问题一:将X上的63个盘子借助Z移动到Y上,拆解为: a.将前62个盘 ...