2.1) freemarker 介绍

  1. FreeMarker 是一款 模板引擎: 即一种基于模板和要改变的数据, 并用来生成输出文本(HTML网页,电子邮件,配置文件,源代码等)的通用工具。 它不是面向最终用户的,而是一个Java类库,是一款程序员可以嵌入他们所开发产品的组件。
  2. 模板编写为FreeMarker Template Language (FTL)。它是简单的,专用的语言, _不是_ PHP那样成熟的编程语言。 那就意味着要准备数据在真实编程语言中来显示,比如数据库查询和业务运算, 之后模板显示已经准备好的数据。在模板中,你可以专注于如何展现数据, 而在模板之外可以专注于要展示什么数据。

常用的java模板引擎还有哪些?

Jsp、Freemarker、Thymeleaf 、Velocity 等。

1.Jsp 为 Servlet 专用,不能单独进行使用。

2.Thymeleaf 为新技术,功能较为强大,但是执行的效率比较低。

3.Velocity从2010年更新完 2.0 版本后,便没有在更新。Spring Boot 官方在 1.4 版本后对此也不在支持,虽然 Velocity 在 2017 年版本得到迭代,但为时已晚。

2.2) 环境搭建&&快速入门

freemarker作为springmvc一种视图格式,默认情况下SpringMVC支持freemarker视图格式。

需要创建Spring Boot+Freemarker工程用于测试模板。

2.2.1) 创建测试工程

创建一个freemarker-demo 的测试工程专门用于freemarker的功能测试与模板的测试。

pom.xml如下

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <project xmlns="http://maven.apache.org/POM/4.0.0"
  3. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  4. xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  5. <parent>
  6. <artifactId>heima-leadnews-test</artifactId>
  7. <groupId>com.heima</groupId>
  8. <version>1.0-SNAPSHOT</version>
  9. </parent>
  10. <modelVersion>4.0.0</modelVersion>
  11. <artifactId>freemarker-demo</artifactId>
  12. <properties>
  13. <maven.compiler.source>8</maven.compiler.source>
  14. <maven.compiler.target>8</maven.compiler.target>
  15. </properties>
  16. <dependencies>
  17. <dependency>
  18. <groupId>org.springframework.boot</groupId>
  19. <artifactId>spring-boot-starter-web</artifactId>
  20. </dependency>
  21. <dependency>
  22. <groupId>org.springframework.boot</groupId>
  23. <artifactId>spring-boot-starter-freemarker</artifactId>
  24. </dependency>
  25. <dependency>
  26. <groupId>org.springframework.boot</groupId>
  27. <artifactId>spring-boot-starter-test</artifactId>
  28. </dependency>
  29. <!-- lombok -->
  30. <dependency>
  31. <groupId>org.projectlombok</groupId>
  32. <artifactId>lombok</artifactId>
  33. </dependency>
  34. <!-- apache 对 java io 的封装工具库 -->
  35. <dependency>
  36. <groupId>org.apache.commons</groupId>
  37. <artifactId>commons-io</artifactId>
  38. <version>1.3.2</version>
  39. </dependency>
  40. </dependencies>
  41. </project>

2.2.2) 配置文件

配置application.yml

  1. server:
  2. port: 8881 #服务端口
  3. spring:
  4. application:
  5. name: freemarker-demo #指定服务名
  6. freemarker:
  7. cache: false #关闭模板缓存,方便测试
  8. settings:
  9. template_update_delay: 0 #检查模板更新延迟时间,设置为0表示立即检查,如果时间大于0会有缓存不方便进行模板测试
  10. suffix: .ftl #指定Freemarker模板文件的后缀名

2.2.3) 创建模型类

在freemarker的测试工程下创建模型类型用于测试

  1. package com.heima.freemarker.entity;
  2. import lombok.Data;
  3. import java.util.Date;
  4. @Data
  5. public class Student {
  6. private String name;//姓名
  7. private int age;//年龄
  8. private Date birthday;//生日
  9. private Float money;//钱包
  10. }

2.2.4) 创建模板

在resources下创建templates,此目录为freemarker的默认模板存放目录。

在templates下创建模板文件 01-basic.ftl ,模板中的插值表达式最终会被freemarker替换成具体的数据。

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Hello World!</title>
  6. </head>
  7. <body>
  8. <b>普通文本 String 展示:</b><br><br>
  9. Hello ${name} <br>
  10. <hr>
  11. <b>对象Student中的数据展示:</b><br/>
  12. 姓名:${stu.name}<br/>
  13. 年龄:${stu.age}
  14. <hr>
  15. </body>
  16. </html>

2.2.5) 创建controller

创建Controller类,向Map中添加name,最后返回模板文件。

  1. package com.xuecheng.test.freemarker.controller;
  2. import org.springframework.beans.factory.annotation.Autowired;
  3. import org.springframework.stereotype.Controller;
  4. import org.springframework.web.bind.annotation.RequestMapping;
  5. import org.springframework.web.client.RestTemplate;
  6. import java.util.Map;
  7. @Controller
  8. public class HelloController {
  9. @GetMapping("/basic")
  10. public String test(Model model) {
  11. //1.纯文本形式的参数
  12. model.addAttribute("name", "freemarker");
  13. //2.实体类相关的参数
  14. Student student = new Student();
  15. student.setName("小明");
  16. student.setAge(18);
  17. model.addAttribute("stu", student);
  18. return "01-basic";
  19. }
  20. }

01-basic.ftl,使用插值表达式填充数据

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Hello World!</title>
  6. </head>
  7. <body>
  8. <b>普通文本 String 展示:</b><br><br>
  9. Hello ${name} <br>
  10. <hr>
  11. <b>对象Student中的数据展示:</b><br/>
  12. 姓名:${stu.name}<br/>
  13. 年龄:${stu.age}
  14. <hr>
  15. </body>
  16. </html>

2.2.6) 创建启动类

  1. package com.heima.freemarker;
  2. import org.springframework.boot.SpringApplication;
  3. import org.springframework.boot.autoconfigure.SpringBootApplication;
  4. @SpringBootApplication
  5. public class FreemarkerDemotApplication {
  6. public static void main(String[] args) {
  7. SpringApplication.run(FreemarkerDemotApplication.class,args);
  8. }
  9. }

2.2.7) 测试

请求:http://localhost:8881/basic

2.3) freemarker基础

2.3.1) 基础语法种类

1、注释,即<#— —>,介于其之间的内容会被freemarker忽略

  1. <#--我是一个freemarker注释-->

2、插值(Interpolation):即 **${..}** 部分,freemarker会用真实的值代替**${..}**

  1. Hello ${name}

3、FTL指令:和HTML标记类似,名字前加#予以区分,Freemarker会解析标签中的表达式或逻辑。

  1. <# >FTL指令</#>

4、文本,仅文本信息,这些不是freemarker的注释、插值、FTL指令的内容会被freemarker忽略解析,直接输出内容。

  1. <#--freemarker中的普通文本-->
  2. 我是一个普通的文本

2.3.2) 集合指令(List和Map)

1、数据模型:

在HelloController中新增如下方法:

  1. @GetMapping("/list")
  2. public String list(Model model){
  3. //------------------------------------
  4. Student stu1 = new Student();
  5. stu1.setName("小强");
  6. stu1.setAge(18);
  7. stu1.setMoney(1000.86f);
  8. stu1.setBirthday(new Date());
  9. //小红对象模型数据
  10. Student stu2 = new Student();
  11. stu2.setName("小红");
  12. stu2.setMoney(200.1f);
  13. stu2.setAge(19);
  14. //将两个对象模型数据存放到List集合中
  15. List<Student> stus = new ArrayList<>();
  16. stus.add(stu1);
  17. stus.add(stu2);
  18. //向model中存放List集合数据
  19. model.addAttribute("stus",stus);
  20. //------------------------------------
  21. //创建Map数据
  22. HashMap<String,Student> stuMap = new HashMap<>();
  23. stuMap.put("stu1",stu1);
  24. stuMap.put("stu2",stu2);
  25. // 3.1 向model中存放Map数据
  26. model.addAttribute("stuMap", stuMap);
  27. return "02-list";
  28. }

2、模板:

在templates中新增02-list.ftl文件

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Hello World!</title>
  6. </head>
  7. <body>
  8. <#-- list 数据的展示 -->
  9. <b>展示list中的stu数据:</b>
  10. <br>
  11. <br>
  12. <table>
  13. <tr>
  14. <td>序号</td>
  15. <td>姓名</td>
  16. <td>年龄</td>
  17. <td>钱包</td>
  18. </tr>
  19. </table>
  20. <hr>
  21. <#-- Map 数据的展示 -->
  22. <b>map数据的展示:</b>
  23. <br/><br/>
  24. <a href="###">方式一:通过map['keyname'].property</a><br/>
  25. 输出stu1的学生信息:<br/>
  26. 姓名:<br/>
  27. 年龄:<br/>
  28. <br/>
  29. <a href="###">方式二:通过map.keyname.property</a><br/>
  30. 输出stu2的学生信息:<br/>
  31. 姓名:<br/>
  32. 年龄:<br/>
  33. <br/>
  34. <a href="###">遍历map中两个学生信息:</a><br/>
  35. <table>
  36. <tr>
  37. <td>序号</td>
  38. <td>姓名</td>
  39. <td>年龄</td>
  40. <td>钱包</td>
  41. </tr>
  42. </table>
  43. <hr>
  44. </body>
  45. </html>

实例代码:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Hello World!</title>
  6. </head>
  7. <body>
  8. <#-- list 数据的展示 -->
  9. <b>展示list中的stu数据:</b>
  10. <br>
  11. <br>
  12. <table>
  13. <tr>
  14. <td>序号</td>
  15. <td>姓名</td>
  16. <td>年龄</td>
  17. <td>钱包</td>
  18. </tr>
  19. <#list stus as stu>
  20. <tr>
  21. <td>${stu_index+1}</td>
  22. <td>${stu.name}</td>
  23. <td>${stu.age}</td>
  24. <td>${stu.money}</td>
  25. </tr>
  26. </#list>
  27. </table>
  28. <hr>
  29. <#-- Map 数据的展示 -->
  30. <b>map数据的展示:</b>
  31. <br/><br/>
  32. <a href="###">方式一:通过map['keyname'].property</a><br/>
  33. 输出stu1的学生信息:<br/>
  34. 姓名:${stuMap['stu1'].name}<br/>
  35. 年龄:${stuMap['stu1'].age}<br/>
  36. <br/>
  37. <a href="###">方式二:通过map.keyname.property</a><br/>
  38. 输出stu2的学生信息:<br/>
  39. 姓名:${stuMap.stu2.name}<br/>
  40. 年龄:${stuMap.stu2.age}<br/>
  41. <br/>
  42. <a href="###">遍历map中两个学生信息:</a><br/>
  43. <table>
  44. <tr>
  45. <td>序号</td>
  46. <td>姓名</td>
  47. <td>年龄</td>
  48. <td>钱包</td>
  49. </tr>
  50. <#list stuMap?keys as key >
  51. <tr>
  52. <td>${key_index}</td>
  53. <td>${stuMap[key].name}</td>
  54. <td>${stuMap[key].age}</td>
  55. <td>${stuMap[key].money}</td>
  56. </tr>
  57. </#list>
  58. </table>
  59. <hr>
  60. </body>
  61. </html>

👆上面代码解释:

${k_index}:
index:得到循环的下标,使用方法是在stu后边加”_index”,它的值是从0开始

2.3.3) if指令

  1. if 指令即判断指令,是常用的FTL指令,freemarker在解析时遇到if会进行判断,条件为真则输出if中间的内容,否则跳过内容不再输出。
  • 指令格式
  1. <#if ></if>

1、数据模型:

使用list指令中测试数据模型,判断名称为小红的数据字体显示为红色。

2、模板:

  1. <table>
  2. <tr>
  3. <td>姓名</td>
  4. <td>年龄</td>
  5. <td>钱包</td>
  6. </tr>
  7. <#list stus as stu>
  8. <tr>
  9. <td >${stu.name}</td>
  10. <td>${stu.age}</td>
  11. <td >${stu.mondy}</td>
  12. </tr>
  13. </#list>
  14. </table>

实例代码:

  1. <table>
  2. <tr>
  3. <td>姓名</td>
  4. <td>年龄</td>
  5. <td>钱包</td>
  6. </tr>
  7. <#list stus as stu >
  8. <#if stu.name='小红'>
  9. <tr style="color: red">
  10. <td>${stu_index}</td>
  11. <td>${stu.name}</td>
  12. <td>${stu.age}</td>
  13. <td>${stu.money}</td>
  14. </tr>
  15. <#else >
  16. <tr>
  17. <td>${stu_index}</td>
  18. <td>${stu.name}</td>
  19. <td>${stu.age}</td>
  20. <td>${stu.money}</td>
  21. </tr>
  22. </#if>
  23. </#list>
  24. </table>

3、输出:

姓名为“小强”则字体颜色显示为红色。

freemarker - 图1

2.3.4) 运算符

1、算数运算符

FreeMarker表达式中完全支持算术运算,FreeMarker支持的算术运算符包括:

  • 加法: +
  • 减法: -
  • 乘法: *
  • 除法: /
  • 求模 (求余): %

模板代码

  1. <b>算数运算符</b>
  2. <br/><br/>
  3. 100+5 运算: ${100 + 5 }<br/>
  4. 100 - 5 * 5运算:${100 - 5 * 5}<br/>
  5. 5 / 2运算:${5 / 2}<br/>
  6. 12 % 10运算:${12 % 10}<br/>
  7. <hr>

除了 + 运算以外,其他的运算只能和 number 数字类型的计算。

2、比较运算符

  • **=**或者**==**:判断两个值是否相等.
  • **!=**:判断两个值是否不等.
  • **>**或者**gt**:判断左边值是否大于右边值
  • **>=**或者**gte**:判断左边值是否大于等于右边值
  • **<**或者**lt**:判断左边值是否小于右边值
  • **<=**或者**lte**:判断左边值是否小于等于右边值

= 和 == 模板代码

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Hello World!</title>
  6. </head>
  7. <body>
  8. <b>比较运算符</b>
  9. <br/>
  10. <br/>
  11. <dl>
  12. <dt> =/== 和 != 比较:</dt>
  13. <dd>
  14. <#if "xiaoming" == "xiaoming">
  15. 字符串的比较 "xiaoming" == "xiaoming"
  16. </#if>
  17. </dd>
  18. <dd>
  19. <#if 10 != 100>
  20. 数值的比较 10 != 100
  21. </#if>
  22. </dd>
  23. </dl>
  24. <dl>
  25. <dt>其他比较</dt>
  26. <dd>
  27. <#if 10 gt 5 >
  28. 形式一:使用特殊字符比较数值 10 gt 5
  29. </#if>
  30. </dd>
  31. <dd>
  32. <#-- 日期的比较需要通过?date将属性转为data类型才能进行比较 -->
  33. <#if (date1?date >= date2?date)>
  34. 形式二:使用括号形式比较时间 date1?date >= date2?date
  35. </#if>
  36. </dd>
  37. </dl>
  38. <br/>
  39. <hr>
  40. </body>
  41. </html>

Controller 的 数据模型代码

  1. @GetMapping("operation")
  2. public String testOperation(Model model) {
  3. //构建 Date 数据
  4. Date now = new Date();
  5. model.addAttribute("date1", now);
  6. model.addAttribute("date2", now);
  7. return "03-operation";
  8. }

比较运算符注意

  • **=****!=**可以用于字符串、数值和日期来比较是否相等
  • **=****!=**两边必须是相同类型的值,否则会产生错误
  • 字符串 **"x"****"x "****"X"**比较是不等的.因为FreeMarker是精确比较
  • 其它的运行符可以作用于数字和日期,但不能作用于字符串
  • 使用**gt**等字母运算符代替**>**会有更好的效果,因为 FreeMarker会把**>**解释成FTL标签的结束字符
  • 可以使用括号来避免这种情况,如:**<#if (x>y)>**

3、逻辑运算符

  • 逻辑与:&&
  • 逻辑或:||
  • 逻辑非:!

逻辑运算符只能作用于布尔值,否则将产生错误 。

模板代码

  1. <b>逻辑运算符</b>
  2. <br/>
  3. <br/>
  4. <#if (10 lt 12 )&&( 10 gt 5 ) >
  5. (10 lt 12 )&&( 10 gt 5 ) 显示为 true
  6. </#if>
  7. <br/>
  8. <br/>
  9. <#if !false>
  10. false 取反为true
  11. </#if>
  12. <hr>

2.3.5) 空值处理

1、判断某变量是否存在使用 “??”

用法为:variable??,如果该变量存在,返回true,否则返回false

例:为防止stus为空报错可以加上判断如下:

  1. <#if stus??>
  2. <#list stus as stu>
  3. ......
  4. </#list>
  5. </#if>

2、缺失变量默认值使用 “!”

  • 使用!要以指定一个默认值,当变量为空时显示默认值
    例: ${name!’’}表示如果name为空显示空字符串。
  • 如果是嵌套对象则建议使用()括起来
    例: ${(stu.bestFriend.name)!’’}表示,如果stu或bestFriend或name为空默认显示空字符串。

2.3.6) 内建函数

内建函数语法格式: **变量+?+函数名称**

1、和到某个集合的大小

**${集合名?size}**

2、日期格式化

显示年月日: **${today?date}**
显示时分秒:**${today?time}**
显示日期+时间:**${today?datetime}**
自定义格式化: **${today?string("yyyy年MM月")}**

3、内建函数**c**

model.addAttribute(“point”, 102920122);

point是数字型,使用${point}会显示这个数字的值,每三位使用逗号分隔。

如果不想显示为每三位分隔的数字,可以使用c函数将数字型转成字符串输出

**${point?c}**

4、将json字符串转成对象

一个例子:

其中用到了 assign标签,assign的作用是定义一个变量。

  1. <#assign text="{'bank':'工商银行','account':'10101920201920212'}" />
  2. <#assign data=text?eval />
  3. 开户行:${data.bank} 账号:${data.account}

模板代码:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>inner Function</title>
  6. </head>
  7. <body>
  8. <b>获得集合大小</b><br>
  9. 集合大小:
  10. <hr>
  11. <b>获得日期</b><br>
  12. 显示年月日: <br>
  13. 显示时分秒:<br>
  14. 显示日期+时间:<br>
  15. 自定义格式化: <br>
  16. <hr>
  17. <b>内建函数C</b><br>
  18. 没有C函数显示的数值: <br>
  19. 有C函数显示的数值:
  20. <hr>
  21. <b>声明变量assign</b><br>
  22. <hr>
  23. </body>
  24. </html>

内建函数模板页面:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>inner Function</title>
  6. </head>
  7. <body>
  8. <b>获得集合大小</b><br>
  9. 集合大小:${stus?size}
  10. <hr>
  11. <b>获得日期</b><br>
  12. 显示年月日: ${today?date} <br>
  13. 显示时分秒:${today?time}<br>
  14. 显示日期+时间:${today?datetime}<br>
  15. 自定义格式化: ${today?string("yyyy年MM月")}<br>
  16. <hr>
  17. <b>内建函数C</b><br>
  18. 没有C函数显示的数值:${point} <br>
  19. 有C函数显示的数值:${point?c}
  20. <hr>
  21. <b>声明变量assign</b><br>
  22. <#assign text="{'bank':'工商银行','account':'10101920201920212'}" />
  23. <#assign data=text?eval />
  24. 开户行:${data.bank} 账号:${data.account}
  25. <hr>
  26. </body>
  27. </html>

内建函数Controller数据模型:

  1. @GetMapping("innerFunc")
  2. public String testInnerFunc(Model model) {
  3. //1.1 小强对象模型数据
  4. Student stu1 = new Student();
  5. stu1.setName("小强");
  6. stu1.setAge(18);
  7. stu1.setMoney(1000.86f);
  8. stu1.setBirthday(new Date());
  9. //1.2 小红对象模型数据
  10. Student stu2 = new Student();
  11. stu2.setName("小红");
  12. stu2.setMoney(200.1f);
  13. stu2.setAge(19);
  14. //1.3 将两个对象模型数据存放到List集合中
  15. List<Student> stus = new ArrayList<>();
  16. stus.add(stu1);
  17. stus.add(stu2);
  18. model.addAttribute("stus", stus);
  19. // 2.1 添加日期
  20. Date date = new Date();
  21. model.addAttribute("today", date);
  22. // 3.1 添加数值
  23. model.addAttribute("point", 102920122);
  24. return "04-innerFunc";
  25. }

2.4) 静态化测试

之前的测试都是SpringMVC将Freemarker作为视图解析器(ViewReporter)来集成到项目中,工作中,有的时候需要使用Freemarker原生Api来生成静态内容,下面一起来学习下原生Api生成文本文件。

2.4.1) 需求分析

使用freemarker原生Api将页面生成html文件,本节测试html文件生成的方法:

freemarker - 图2

2.4.2) 静态化测试

根据模板文件生成html文件

①:修改application.yml文件,添加以下模板存放位置的配置信息,完整配置如下:

  1. server:
  2. port: 8881 #服务端口
  3. spring:
  4. application:
  5. name: freemarker-demo #指定服务名
  6. freemarker:
  7. cache: false #关闭模板缓存,方便测试
  8. settings:
  9. template_update_delay: 0 #检查模板更新延迟时间,设置为0表示立即检查,如果时间大于0会有缓存不方便进行模板测试
  10. suffix: .ftl #指定Freemarker模板文件的后缀名
  11. template-loader-path: classpath:/templates #模板存放位置

②:在test下创建测试类

  1. package com.heima.freemarker.test;
  2. import com.heima.freemarker.FreemarkerDemoApplication;
  3. import com.heima.freemarker.entity.Student;
  4. import freemarker.template.Configuration;
  5. import freemarker.template.Template;
  6. import freemarker.template.TemplateException;
  7. import org.junit.Test;
  8. import org.junit.runner.RunWith;
  9. import org.springframework.beans.factory.annotation.Autowired;
  10. import org.springframework.boot.test.context.SpringBootTest;
  11. import org.springframework.test.context.junit4.SpringRunner;
  12. import java.io.FileWriter;
  13. import java.io.IOException;
  14. import java.util.*;
  15. @SpringBootTest(classes = FreemarkerDemoApplication.class)
  16. @RunWith(SpringRunner.class)
  17. public class FreemarkerTest {
  18. @Autowired
  19. private Configuration configuration;
  20. @Test
  21. public void test() throws IOException, TemplateException {
  22. //freemarker的模板对象,获取模板
  23. Template template = configuration.getTemplate("02-list.ftl");
  24. Map params = getData();
  25. //合成
  26. //第一个参数 数据模型
  27. //第二个参数 输出流
  28. template.process(params, new FileWriter("d:/list.html"));
  29. }
  30. private Map getData() {
  31. Map<String, Object> map = new HashMap<>();
  32. //小强对象模型数据
  33. Student stu1 = new Student();
  34. stu1.setName("小强");
  35. stu1.setAge(18);
  36. stu1.setMoney(1000.86f);
  37. stu1.setBirthday(new Date());
  38. //小红对象模型数据
  39. Student stu2 = new Student();
  40. stu2.setName("小红");
  41. stu2.setMoney(200.1f);
  42. stu2.setAge(19);
  43. //将两个对象模型数据存放到List集合中
  44. List<Student> stus = new ArrayList<>();
  45. stus.add(stu1);
  46. stus.add(stu2);
  47. //向map中存放List集合数据
  48. map.put("stus", stus);
  49. //创建Map数据
  50. HashMap<String, Student> stuMap = new HashMap<>();
  51. stuMap.put("stu1", stu1);
  52. stuMap.put("stu2", stu2);
  53. //向map中存放Map数据
  54. map.put("stuMap", stuMap);
  55. //返回Map
  56. return map;
  57. }
  58. }