一:概括

  1. pom.xml添加依赖
  2. 配置application.yml
  3. HTML页面使用表达式

二:Freemarker模板引擎

1.添加依赖

        <!-- ftl模板引擎 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-freemarker</artifactId>
        </dependency>

2.配置参数

#Freemarker模板引擎
spring:
  freemarker:
    template-loader-path:
    - classpath:/templates
    charset: UTF-8
    check-template-location: true
    content-type: text/html
    expose-request-attributes: true
    expose-session-attributes: true
    request-context-attribute: request
    suffix: .ftl
    cache: false
    #关闭缓存,及时刷新,上线需要改成true

3.模板使用
在templates文件夹下新建freemarker文件夹,然后在该文件夹下新建index.html

<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></meta>
<title>Freemarket</title>
</head>
<body>
${message}
</body>
</html>

4.Controller返回视图

@Controller()
@RequestMapping("/ftl")
public class FtlController {

    @GetMapping("/hello")
    public String hello(ModelMap map) {
        map.addAttribute("message", "Hello! freemarket!");
        return "/freemarker/index";
    }

}

三:Thymeleaf模板引擎

1.添加依赖

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

2.配置参数(一般情况不用配置)

#Thymeleaf 静态资源配置
spring:
  thymeleaf:
      prefix: classpath:/templates/
      suffix: .html
      mode: HTML5
      encoding: UTF-8
      content-type: text/html
      cache: false
#关闭缓存,即使刷新,上线需要改成true
#i18n配置
  messages:
    basename: i18n/messages
    cache-seconds: 3600
    encoding: UTF-8

在源文件夹下新建i18n/messages文件夹目录,在该目录下新建messages.properties:

roles.manager=manager
roles.superadmin=superadmin

2.模板使用
thymeleaf涉及的标签很多

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta charset="UTF-8" />
    <title></title>

<!--    <script th:src="@{/js/test.js}"></script> -->

</head>
<body>
<!--@{}是用来输出内容的,${}是用来输出对象的,#{}是输出i18n的参数-->
<div>
    用户姓名:<input th:id="${user.name}" th:name="${user.name}" th:value="${user.name}"/>
    <br/>
    用户年龄:<input th:value="${user.age}"/>
    <br/>
    用户生日:<input th:value="${user.birthday}"/>
    <br/>
    用户生日:<input th:value="${#dates.format(user.birthday, 'yyyy-MM-dd')}"/>
    <br/>
</div>

<br/>

<div th:object="${user}">
    用户姓名:<input th:id="*{name}" th:name="*{name}" th:value="*{name}"/>
    <br/>
    用户年龄:<input th:value="*{age}"/>
    <br/>
    用户生日:<input th:value="*{#dates.format(birthday, 'yyyy-MM-dd hh:mm:ss')}"/>
    <br/>
</div>

<br/>

text 与 utext :<br/>
<span th:text="${user.desc}">abc</span>
<br/>
<span th:utext="${user.desc}">abc</span>
<br/>
<br/>

URL:<br/>
<a href="" th:href="@{http://www.imooc.com}">网站地址</a>
<br/>

<br/>
<form th:action="@{/th/postform}" th:object="${user}" method="post" th:method="post">
    <input type="text" th:field="*{name}"/>
    <input type="text" th:field="*{age}"/>
    <input type="submit"/>
</form>
<br/>

<br/>
<div th:if="${user.age} == 18">十八岁的天空</div>
<div th:if="${user.age} gt 18">你老了</div>
<div th:if="${user.age} lt 18">你很年轻</div>
<div th:if="${user.age} ge 18">大于等于</div>
<div th:if="${user.age} le 18">小于等于</div>
<br/>

<br/>
<select>
     <option >选择框</option>
     <option th:selected="${user.name eq 'lee'}">lee</option>
     <option th:selected="${user.name eq 'imooc'}">imooc</option>
     <option th:selected="${user.name eq 'LeeCX'}">LeeCX</option>
</select>
<br/>

<br/>
<table>
    <tr>
        <th>姓名</th>
        <th>年龄</th>
        <th>年龄备注</th>
        <th>生日</th>
    </tr>
    <tr th:each="person:${userList}">
        <td th:text="${person.name}"></td>
        <td th:text="${person.age}"></td>
        <td th:text="${person.age gt 18} ? 你老了 : 你很年轻">18岁</td>
        <td th:text="${#dates.format(user.birthday, 'yyyy-MM-dd hh:mm:ss')}"></td>
    </tr>
</table>
<br/>

<br/>
<!--i18n配置-->
<div th:switch="${user.name}">
  <p th:case="'lee'">lee</p>
  <p th:case="#{roles.manager}">普通管理员</p>
  <p th:case="#{roles.superadmin}">超级管理员</p>
  <p th:case="*">其他用户</p>
</div>
<br/>

</body>
</html>

4.Controller返回视图

@Controller
@RequestMapping("th")
public class ThymeleafController {

    @RequestMapping("/index")
    public String index(ModelMap map) {
        map.addAttribute("name", "thymeleaf-imooc");
        return "thymeleaf/index";
    }

    @RequestMapping("center")
    public String center() {
        return "thymeleaf/center/center";
    }

    @RequestMapping("test")
    public String test(ModelMap map) {

        User u = new User();
        u.setName("superadmin");
        u.setAge(10);
        u.setPassword("123465");
        u.setBirthday(new Date());
        u.setDesc("<font color='green'><b>hello imooc</b></font>");

        map.addAttribute("user", u);

        User u1 = new User();
        u1.setAge(19);
        u1.setName("imooc");
        u1.setPassword("123456");
        u1.setBirthday(new Date());

        User u2 = new User();
        u2.setAge(17);
        u2.setName("LeeCX");
        u2.setPassword("123456");
        u2.setBirthday(new Date());

        List<User> userList = new ArrayList<>();
        userList.add(u);
        userList.add(u1);
        userList.add(u2);

        map.addAttribute("userList", userList);

        return "thymeleaf/test";
    }

    @PostMapping("postform")
    public String postform(User u) {

        System.out.println("姓名:" + u.getName());
        System.out.println("年龄:" + u.getAge());

        return "redirect:/th/test";
    }

    @RequestMapping("showerror")
    public String showerror(User u) {

        int a = 1 / 0;

        return "redirect:/th/test";
    }
}

SpringBoot集成Freemarker与Thymeleaf的更多相关文章

  1. SpringBoot集成freemarker和thymeleaf模板

    1.在MAVEN工程POM.XML中引入依赖架包 <!-- 引入 freemarker 模板依赖 --> <dependency> <groupId>org.spr ...

  2. springboot 集成 freemarker

    前面我们已经实现了thymeleaf模板,其实freemarker和thymeleaf差不多,都可以取代JSP页面,实现步骤也差不多,我们来简单实现一下 引入pom.xml依赖如下 <depen ...

  3. Springboot集成FreeMarker

    Apache官网对FreeMarker的解释如下: Apache FreeMarker™是一个模板引擎 :一个基于模板和变化的数据来生成文本输出(HTML网页,电子邮件,配置文件,源代码,等等)的Ja ...

  4. SpringBoot学习笔记(4)----SpringBoot中freemarker、thymeleaf的使用

    1. freemarker引擎的使用 如果你使用的是idea或者eclipse中安装了sts插件,那么在新建项目时就可以直接指定试图模板 如图: 勾选freeMarker,此时springboot项目 ...

  5. springboot之freemarker 和thymeleaf模板web开发

    Spring Boot 推荐使用Thymeleaf.FreeMarker.Velocity.Groovy.Mustache等模板引擎.不建议使用JSP. 一.Spring Boot 中使用Thymel ...

  6. SpringBoot 集成FreeMarker

    SpringBoot官方不推荐使用jsp,因为jsp不好发挥SpringBoot的特性.官方推荐使用模板引擎代替jsp,现在很多公司都使用FreeMarker来作为SpringBoot的视图. Spr ...

  7. springboot模板(Freemarker与Thymeleaf)

    Thymeleaf模板 Thymeleaf就是html页面 导入pom依赖 <dependency> <groupId>org.springframework.boot< ...

  8. springboot集成freemarker 配置application.properties详解

    #配置freemarker详解 #spring.freemarker.allow-request-override=false # Set whether HttpServletRequest att ...

  9. springboot集成freemarker属性配置(不知道是针对于某个版本,2.0后有变动)

    freemarker属性配置 freemarker属性配置: spring.freemarker.allow-request-override=false # 设置是否允许HttpServletReq ...

随机推荐

  1. HTML表单 CSS样式

    1.HTML表单 <body rightmargin="50" leftmargin="50" background="未标题-1.jpg&qu ...

  2. NPOI 笔记

    前言 文档:http://npoi.codeplex.com/documentation 示例:https://npoi.svn.codeplex.com/svn/ 下载:https://www.nu ...

  3. May 24. 2018 Week 21st Thursday

    Man errs so long as he strives. 失误是进取的代价. It is not important that the man in the arena didn't win, ...

  4. Unity基础6 Shadow Map 阴影实现

    这篇实现来的有点墨迹,前前后后折腾零碎的时间折腾了半个月才才实现一个基本的shadow map流程,只能说是对原理理解更深刻一些,但离实际应用估计还需要做很多优化.这篇文章大致分析下shadow ma ...

  5. tomcat启动超过时间

    Server Tomcat v9.0 Server at localhost was unable to start within 45 seconds. 运行超时 最近我切换了JDK版本之后,将10 ...

  6. ab和jmeter进行GET/POST压力测试的使用心得和比较

    引言: 互联网服务压测是非常重要的评价方法,ab,webbench,jmeter等都是业界流行的测试工具,ab和webbench作为shell模式下轻量级的测试工具,jmeter则作为有GUI界面的更 ...

  7. Cassandra联手Spark 大数据分析将迎来哪些改变?

    2014Spark峰会在美国旧金山举行,与会数据库平台供应商DataStax宣布,与Spark供应商Databricks合作,在它的旗舰产 品 DataStax Enterprise 4.5 (DSE ...

  8. js data日期初始化的5种方法 [转]

    创建一个日期对象: 复制代码代码如下: var objDate=new Date([arguments list]);  参数形式有以下5种: 1)new Date("month dd,yy ...

  9. 数据库的连接、会话与SQLite

    通俗来讲,会话(Session) 是通信双方从开始通信到通信结束期间的一个上下文(Context).这个上下文是一段位于服务器端的内存:记录了本次连接的所有相关状态和运行数据. 连接(Connecti ...

  10. centos7下kubernetes(10。kubernetes-daemonset)

    deployment部署得副本pod会分布在各个node上,每个node上可以运行很多个pod. daemonset的不同之处就在于,daemonset可以让每个node上只运行一个pod daemo ...