02.SpringBoot - Thymeleaf入门

有时候我们需要在页面上显示一些动态的数据，比如，登录失败的时候，我们需要显示为什么失败。登录成功进入首页，我们需要在右上角显示登录人的昵称。又或者我们想查询所有学生的信息，这些数据想要在页面上显示，我们应该如何显示呢?

在以前的时候，有诸如使用jsp ，配合作用域显示，也有使用freemarker模板技术，如今我们给大家讲讲SpringBoot 主推的模板技术Thymeleaf. 使用这个Thymeleaf，我们很简单即可在页面上显示一些动态数据。

1. 什么是Thymeleaf

Thymeleaf 是一款用于渲染XML/XHTML/HTML5内容的模板引擎，类似JSP、Velocity、FreeMarker 等模板引擎。 Thymeleaf的主要目的是提供一个优雅和格式良好的方式创建模板。为了实现这一目标,它把预定义的逻辑放在XML的标记和属性上,而不是显式放在XML标记的内容上

2. 如何使用Thymeleaf

添加依赖

compile("org.thymeleaf:thymeleaf-spring4:2.1.4.RELEASE")
compile("org.springframework.boot:spring-boot-starter-web:1.5.15.RELEASE")

controller封装数据

@requestMapping("test")
public String test(){
    
    ModelAndView modelAndView = new ModelAndView();
   
    //设置模型数据
    modelAndView.addObject("name" , "林志颖");

    //设置跳转的目标是哪里。 list.html
    modelAndView.setViewName("list");
    
    return "index";
}

声明模板页面

务必要在resources下面新建一个templates文件夹，用于存放模板页面。早前我们说的static 页面是用于存放静态页面，静态页面的内容都是固定好的，不会再改变。而要显示动态数据的页面，需要放置在resources/templates文件夹中。我们一般把这些页面称之为模板页面。

页面显示数据

<!-- 引入命名空间 -->
<html xmlns:th="http://www.thymeleaf.org" >
<body>
   
    <!-- thymeleaf的模板取值显示都是写在标签里面。使用th命名空间来取值 
    
     1.  取值的写法是： ${属性的名称} ， 这种写法不能独立存在，
    必须放在th:xxx="${属性名称}"

    2. 如果数据要放置到标签的中间形成文本，那么使用th:text,
    如果数据要填充到标签的value属性中，那么使用th:value  -->
    <p th:text="${name}"></p> <br/>
    
    <!--/*@thymesVar id="name" type="java.lang.String"*/-->
    <input type="text" th:value="${name}"/>
      
</body>

两个注意：
1、${name} name底部会有一条红色波浪线，可以使用Alt+Enter 选择添加可解决.

  <!--/*@thymesVar id="name" type="java.lang.String"*/-->

2、html文件中的所有标签一定要有闭合标签，例如：

<meta charset="UTF-8"/>
<title>Title</title>

如果缺少闭合标签会运行报错：

01.png

02.png

3. 存值手法

使用Model参数存值

 @RequestMapping("test")
 public String test(Model model){

     model.addAttribute("address","深圳");

     return "testpage";
 }

使用ModelAndView对象存值

@RequestMapping("test2")
public ModelAndView test2(){

    ModelAndView modelAndView = new ModelAndView();

    //1. 存数据
    modelAndView.addObject("address","北京");

    //2. 指定视图
    modelAndView.setViewName("testPage");

    return modelAndView;
}

4. 基本用法

这里的基本用法，我们给大家讲两个基本的表达式即可表达式要求务必写在 th:xxx这样的属性中。而th:xxx这样的属性又必须写在html标签中，不能单独使用。

变量表达式

用于取值 ${变量名}
URL表达式

用于指定超链接 @{路径}

如果是需要从model中取值的话，写法为

th:href="@{${model中的name值}}"。

有的时候我们不止需要从model中进行取值，还需写字符串与model中的值进行拼接，写法为

th:href="@{'字符串'+${model中的name值}}"。

02.SpringBoot - Thymeleaf入门