Thymeleaf 官方解释：

Thymeleaf是一个用于web和独立环境的现代服务器端Java模板引擎。

Thymeleaf的主要目的是将优雅的自然模板引入到您的开发工作流中——以使HTML可以在浏览器中正确显示，也可以

作为静态原型使用，从而在开发团队中实现更强的协作。

使用Spring Framework的模块，一个用您最喜欢的工具集成的主机 以及插入您自己功能的能力，Thymeleaf是现代HTML5 JVM

web开发的理想选择——尽管它还可以做更多事情。

Demo

1.Idea下新建一个springboot项目 ，添加依赖：

<dependency>

        <groupId>org.springframework.boot</groupId>

        <artifactId>spring-boot-starter-thymeleaf</artifactId>

</dependency>

2.新建一个Person实体类：

public class Person {

    private String name;

    private Integer age;

    public Person(String name, Integer age) {

        this.name = name;

        this.age = age;

    }

    public String getName() {

        return name;

    }

    public void setName(String name) {

        this.name = name;

    }

    public Integer getAge() {

        return age;

    }

    public void setAge(Integer age) {

        this.age = age;

    }

}

3.测试Controller：

@Controller

public class Test {

    @RequestMapping("/testThymeleaf")

    public String index(Model model){

        Person single=new Person("Eminem",0);

        List<Person> people=new ArrayList<Person>();

        Person p1=new Person("Kobe",1);

        Person p2=new Person("James",2);

        Person p3=new Person("Jordan",3);

        people.add(p1);

        people.add(p2);

        people.add(p3);

        model.addAttribute("singlePerson",single);

        model.addAttribute("people",people);

        return "index";

    }

}

4.templates下新建一个 index.html

<!DOCTYPE html>

<html xmlns:th="http://www.thymeleaf.org"

      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">

<head>

    <meta name="viewport" content="width=device-width,initial-scale=1"/>

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

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

    <meta charset="UTF-8"/>

    <title>Title</title>

</head>

<body>

<div class="panel panel-primary">

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

        <div class="panel panel-primary">

            <h3 class="panel-title">列表</h3>

        </div>

        <div class="panel-body">

            <span th:text="${singlePerson.name}"></span>

        </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>

                    <button class="btn" th:onclick= "getName([[${person.name}]])">点击获得名字</button>

                </li>

            </ul>

        </div>

    </div>

</div>

<script th:src="@{jquery-1.10.2.min.js}" type="text/javascript"></script>

<script th:src="@{bootstrap/js/bootstrap.min.js}"></script>

<script th:inline="javascript">

    function getName(name) {

        console.log(name);

    }

</script>

</body>

</html>

5.启动项目，访问http://localhost:8080/testThymeleaf ，结果如下：

代码下载地址：https://github.com/liuchunbo24/Springboot-Thymeleaf-Demo

Springboot集成Thymeleaf的更多相关文章

  1. Springboot 集成 Thymeleaf 及常见错误

    Thymeleaf模板引擎是springboot中默认配置,与freemarker相似,可以完全取代jsp,在springboot中,它的默认路径是src/main/resources/templat ...

  2. 九、SpringBoot集成Thymeleaf模板引擎

    Thymeleaf咋读!??? 呵呵,是不是一脸懵逼...哥用我的大学四级英文知识告诉你吧:[θaimlif]. 啥玩意?不会音标?...那你就这样叫它吧:“赛母李府”,大部分中国人是听不出破绽的.. ...

  3. SpringBoot集成thymeleaf(自定义)模板中文乱码的解决办法

    楼主今天在学习SpringBoot集成thymelaf的时候报了中文乱码的错误,经过网上的搜索,现在得到解决的办法,分享给大家: package com.imooc.config; import or ...

  4. SpringBoot集成Thymeleaf模板引擎

    简单介绍 目前在JavaEE领域有几中比较常用的模板引擎,分别是Jsp.Velocity.Freemarker.Thymeleaf,对Freemark语法不是特别熟悉,不过对于前端页面渲染效率来说,j ...

  5. spring-boot集成thymeleaf。

    thymeleaf是前台页面展示,原来一直是jsp,jsp中包含很多服务器端的逻辑,逐渐淘汰.同样功能的还有freemarker.孰好孰坏不予评价,只做简单实现. 1.基本思路 (1)pom.xml中 ...

  6. SpringBoot集成Thymeleaf模板

    1.添加起步依赖: <dependency> <groupId>org.springframework.boot</groupId> <artifactId& ...

  7. SpringBoot集成Thymeleaf发送Html邮件报错

    由于业务需求需要使用Thymeleaf作为模板发送Html邮件,开发调试过程中发生以下错误 org.thymeleaf.exceptions.TemplateInputException: Error ...

  8. springboot集成thymeleaf中遇到的问题

    错误:不能返回页面,只返回字符串. 原因:在controller中使用了注解@RestController 修改:修改注解为@Controller @Controller 分析: RestContro ...

  9. springboot集成thymeleaf中遇到不能反悔页面,只能反悔字符串

    错误:::::不能返回页面,只能返回字符串 原因::::在controller中使用了注解@RestController 修改注解为:@Controller 分析: RestController = ...

随机推荐

  1. Delphi IfThen语句

    function IfThen(AValue: Boolean; const ATrue: string; AFalse: string = ''): string; overload; $[StrU ...

  2. eslint 代码缩进 报错及解决

    一.背景 使用vue在VScode中正常写的代码,报了一堆的错误,仔细检查,发现都是缩进要么多了要么少了,总之是代码不规范的的报错. 二.原因 百度查了发现代码规范默认缩进2个空格,而VScode默认 ...

  3. SpringCloud微服务Zuul跨域问题

    目前项目结构是VUE做前端,后端采用微服务架构,在开发时前端需要跨域请求数据,通过ZuulFilter配置解决了简单跨域请求需要.但当需要在请求的header中增加token信息时,出现了请求失败的情 ...

  4. pytorch中文文档-torch.nn常用函数-待添加-明天继续

    https://pytorch.org/docs/stable/nn.html 1)卷积层 class torch.nn.Conv2d(in_channels, out_channels, kerne ...

  5. nginx 常见正则匹配符号表示

    1.^: 匹配字符串的开始位置: 2. $:匹配字符串的结束位置: 3..*: .匹配任意字符,*匹配数量0到正无穷: 4.\. 斜杠用来转义,\.匹配 . 特殊使用方法,记住记性了: 5.(值1|值 ...

  6. QPen

    Help on class QPen in module PyQt5.QtGui: class QPen(sip.simplewrapper) |  QPen() |  QPen(Qt.PenStyl ...

  7. 【原创】小说:我是一条DQL

    SQL执行流程图如下 本文改编自<高性能Mysql>,烟哥用小说的形式来讲这个内容. 序章 自我介绍 我是一条sql,就是一条长长的字符串,不要问我长什么样,因为我比较傲娇. 额~~不是我 ...

  8. 08 Django REST Framework 解决前后端分离项目中的跨域问题

    01-安装模块 pip install django-cors-headers 02-添加到INSTALL_APPS中 INSTALLED_APPS = ( ... 'corsheaders', .. ...

  9. 类String 常用方法

    字符串当中的常用方法之比较相关的方法 public boolean equals (object obj):将此字符串与指定的对象进行比较(只有参数是字符串并且内容相同才会返回true) public ...

  10. Socket网络编程（案例）

    Socket:套接字 java.net包 1.流式套接字:基于TCP协议的Socket网络编程 工作方式: 1.客户端A连接到服务器: 2.服务器建立连接并把客户端A添加到列表: 3.客户端B.C.. ...