知之为知之,深知深知。
一、什么是FreeMarker
先来看看官网是怎么说的:
FreeMarker 是一款模板引擎: 即一种基于模板和要改变的数据, 并用来生成输出文本(HTML网页,电子邮件,配置文件,源代码等)的通用工具。 它不是面向最终用户的,而是一个Java类库,是一款程序员可以嵌入他们所开发产品的组件。
模板编写为FreeMarker Template Language (FTL)。它是简单的,专用的语言, 不是像PHP那样成熟的编程语言。 那就意味着要准备数据在真实编程语言中来显示,比如数据库查询和业务运算, 之后模板显示已经准备好的数据。在模板中,你可以专注于如何展现数据, 而在模板之外可以专注于要展示什么数据。
意思就是说,只要有模板和数据,就能构建成html静态页面,最主要还是免费的。如图所示:
二、FreeMarker基础知识
FreeMarker模板文件主要由如下4个部分组成:
-
文本:直接输出的部分
-
注释:<#-- … -->格式部分,不会输出 注释:<#-- … -->格式部分,不会输出
-
插值:FreeMarker的插值有如下两种类型:1,通用插值${expr};2,数字格式化插值:#{expr}或#{expr;format}
-
FTL指令:FreeMarker指定,和HTML标记类似,名字前加#予以区分,不会输出 FTL指令:FreeMarker指定,和HTML标记类似,名字前加#予以区分,不会输出
三、spring MVC 结合Freemarker
1、创建maven工程,除添加spring的依赖之外,在pom文件中再添加如下依赖:
<dependency>
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.16</version>
</dependency>
2、在spring配置文件中,添加如下配置:
<!-- 配置freeMarker视图解析器 -->
<bean id="viewResolverHtml" class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver">
<property name="viewClass" value="org.springframework.web.servlet.view.freemarker.FreeMarkerView"/>
<property name="contentType" value="text/html; charset=utf-8"/>
<property name="suffix" value=".html"/>
<property name="order" value="0"/>
</bean>
<!-- 配置freeMarker的模板路径 -->
<bean id="freemarkerConfig" class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
<property name="templateLoaderPath">
<value>/WEB-INF/views/</value>
</property>
<property name="freemarkerVariables">
<map>
<entry key="xml_escape" value-ref="fmXmlEscape"/>
</map>
</property>
<property name="defaultEncoding">
<value>utf-8</value>
</property>
<property name="freemarkerSettings">
<props>
<prop key="template_update_delay">5</prop>
</props>
</property>
</bean>
<bean id="fmXmlEscape" class="freemarker.template.utility.XmlEscape"/>
controller控制器类中,将数据传给前台:
@Controller
@RequestMapping("/orb")
public class FreeMarkerController {
@RequestMapping(value = "/free", method = RequestMethod.GET)
public String freeTest(HttpServletRequest request, Model model) {
Person p = new Person();
p.setName("swc");
p.setSex("男");
p.setAge(25);
p.setMobile("18811520000");
// 创建插值的map
Map<String,Object> map = new HashMap<String,Object>();
map.put("user", p.getName());
map.put("url", "http://www.swc.com/");
map.put("name", "宋先森");
model.addAttribute("person",p);
model.addAttribute("map",map);
return "/orb/free";
}
}
在前端页面,使用freemarker插值和指令,获取数据:
<div class="row" style="position:absolute; top:50px; left:220px; right:0px; height:50px;background-color:#ffffff; ">
<div class="btn-group" style="left: 60px;top:5px;">
<h1>1.你好${person.name}</h1>
<!-- <input type="text" id="jsonValues" />-->
<#if (person.mobile)??> <#--if后不用加$-->
<h2>2.电话:${person.mobile}</h2>
<#else>
2.电话为空
</#if>
<h2>3.map 取值:</h2>
<#list map?keys as k>
<h3>${k}---${map[k]}</h3><br/>
</#list>
</div>
</div>
</section>
测试结果如图所示: