定义
Freemarker是一个模板搜索引擎,一个基于模板生成文本输出的工具,采用纯java编写;虽然Freemarker具有一定的编程能力,但是通常还是需要由java程序提供需要显示的数据。
核心:模板+数据模型=输出
使用场景及作用
- 动态页面
模板引擎可以让程序实现界面与数据分离,业务代码与逻辑代码的分离,这就提升了开发效率,良好的设计也使得代码复用变得更加容易。在模板中可以专注如果展示数据,而在模板之外,可以更专注要展示哪些数据。 - 页面静态化
使用模板+数据模型,就能能够实现数据的展示,快速将两者进行组合,生成一个完成渲染的静态化html页面。 - 代码生成器
能够根据提前编写好的模板,使用Freemarker提供的指定,配合数据模型,达到生成代码的功能。
使用
- 导入maven依赖
<dependency>
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.23</version>
</dependency>
- 创建模板文件
模板中一般包含4中元素:
- 文本:直接输出的部分。
- 注释:使用
<#--注释内容-->
注释符号中的数据不会输出。 - 插值:使用
${}
,表达式,就能够使用数据模型中的对应数据,替换插值表达式中的变量,进行数据输出。 - FTL指令:Freemarker指令,类似于HTML标记,指令前会加
#
井号进行区分。
注意:freemarker模板文件的后缀名可以任意,但是一般使用ftl
作为后缀名。
在本地磁盘创建
<html>
<head>
<meta charset="utf-8">
<title>Freemarker入门</title>
</head>
<body>
<#--我只是一个注释,我不会有任何输出 -->
${name}你好,${message}
</body>
</html>
- 编写java类
public static void main(String[] args) throws IOException, TemplateException {
/*
1.设置配置,加载模板
*/
//创建一个Configuration对象,参数为freemarker的版本号
Configuration configuration = new Configuration(Configuration.getVersion());
//配置模板文件所在目录
configuration.setDirectoryForTemplateLoading(new File("D:/ftl"));
//设置编码
configuration.setDefaultEncoding("UTF-8");
//加载模板文件,注意加载的模板文件名,必须要在配置的目录下
Template template = configuration.getTemplate("freemarker.ftl");
/*
2.设置数据模型
*/
//设置数据模型,注意的是,添加的key要和模板中取数据时所用的key相同
Map map = new HashMap();
map.put("name", "张三");
map.put("message", "哈哈");
/*
3.将数据模型与模板进行组合输出
*/
//定数据输出的文件,并获取该文件的字符输出流
FileWriter writer = new FileWriter("D:/ftl/test.html");
//将模板输出
template.process(map, writer);
//关闭流
writer.close();
}
- 注意
- freemarker再与spring进行整合,生成静态页面时,如果出现乱码问题,可以使用记事本软件打开静态页面,如果在记事本中出现乱码,那么就需要指定数据库的编码格式。
jdbc.url=jdbc:mysql://192.168.242.130:3306/hse?characterEncoding=UTF-8&serverTimezone=UTC
- 如果记事本中正常显示,但是静态网页本身出现乱码,那么就需要设置使用模板生成页面时的输出流,设置输出流的编码。
OutputStreamWriter writer = new OutputStreamWriter(new FileOutputStream(
new File(outPath + "/" + fileName)), "utf-8");
template.process(data, writer);
采用OutputStreamWriter
字符转换流,该流对象是字符流到字节流的桥梁,使用该流对象的时候指定编码格式为utf-8。
zhi’ding
- assign指令
- 作用:用于在页面上定义一个变量。
- 使用:使用
${}
,表达式使用定义的变量 - 定义简单类型
<#assign username="不知火舞">
${username}
- 定义对象类型
<#assign student={"user": "王昭君", "age": 19}>
${student.user}
${student.age}
- include指令
- 作用:用于模板文件的嵌套
- 使用
<#include "要包含的模板文件名.ftl"/>
- if指令
- 作用:用于在模板中进行判断。
模板文件中
<#if bl==true>
判断为真
<#else>
判断为假
</#if>
<#if number==1>
数值为1
<#elseif number==2>
数值为2
<#else>
数值为3
</#if>
java代码
Map map = new HashMap();
map.put("bl", true);
- 注意:也可以在模板文件中使用
assign指令
,定义变量,用作if指令的判断变量
- list指令
- 作用:用于在模板文件中进行遍历输出
- 使用:
模板文件中
<#list goods as goodsList>
商品名称:${goods.name}
商品价格:${goods.price}
<#list>
java代码中
//创建一个list对象
List goodsList=new ArrayList();
//创建map对象,每个map封装一个商品的信息
Map goods1=new HashMap();
goods1.put("name", "苹果");
goods1.put("price", 5.8);
Map goods2=new HashMap();
goods2.put("name", "香蕉");
goods2.put("price", 2.5);
Map goods3=new HashMap();
goods3.put("name", "橘子");
goods3.put("price", 3.2);
//将每个map对象看做是一个商品对虾,k'm'k'k
goodsList.add(goods1);
goodsList.add(goods2);
goodsList.add(goods3);
map.put("goodsList", goodsList);
Spring集合firemarker
- 导入依赖
<dependency>
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.23</version>
</dependency>
- 编写模板文件,模板文件后缀名以
.ftl
结尾 - 在spring中配置模板文件
freemarker.properties(指定通过模板文件生成的静态页面的存放路径)
out_put_path=D:/ideaProjects/health_parent/health_mobile/src/main/webapp/pages
applicationContext-firemarker.xml(在spring初始化的时候,配置firemarker的FreeMarkerConfigurer类对象)
<bean id="freemarkerConfig"
class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
<!--指定模板文件所在目录-->
<property name="templateLoaderPath" value="/WEB-INF/ftl/" />
<!--指定字符集-->
<property name="defaultEncoding" value="UTF-8" />
</bean>
<context:property-placeholder location="classpath:freemarker.properties"/>
- 编写逻辑代码根据模板生成静态页面
在逻辑代码中进行查询等操作,获取需要的数据,建立数据模型,通过与模板页面的结合进行展示,最终生成模板页面。
注意
模板页面还可以结合vue进行使用,页面上使用vue,在js中使用freemarker给数据模型赋值
模板页面
<!--页面省略-->
<script>
var vue = new Vue({
el: '#app',
data: {
//${setMealList}是firemarker表达式,而setMealList对象是通过代码模板代码建立的数据模型
setmealList: ${setMealList}
},
});
</script>
</body>
数据还是通过java代码,传递给模板页面,模板页面就能够使用${}
表达式进行获取。
注意:使用freemarker与vue结合的时候,在vue中不能使用对象.属性的方式,否则会报错!