Freemarker教程1(基本使用)

简介

  FreeMarker是一款模板引擎: 即一种基于模板和要改变的数据, 并用来生成输出文本(HTML网页、电子邮件、配置文件、源代码等)的通用工具。 它不是面向最终用户的,而是一个Java类库,是一款程序员可以嵌入他们所开发产品的组件

官网手册

JavaEE中的两种开发方式

前后端不分离

  要求程序员要掌握js,为了简化页面开发,引入页面模板,页面模板整体上来说又可以分为两大类

前端模板

前端模板就是后缀为html的模板,代表就是Thymeleaf,这种模板有一个好处就是不需要服务端解析就能直接在浏览器中打开。

后端模板

必须经过服务端解析才能被浏览器展示出来的模板

  • JSP
  • Freemarker
  • velocity

前后端分离

前后端分离的时候,后端纯粹只是接口,没有任何页面。所有的页面由前端完成,前端会使用相关的模板。

  • Vue
  • AngularJS
  • React

HelloWorld案例

创建一个maven项目

整合spring和SpringMVC

spring整合SpringMVC

引入freemarker

1.引入freemarker依赖

<dependency>
	<groupId>org.freemarkergroupId>
	<artifactId>freemarkerartifactId>
	<version>2.3.28version>
dependency>

<dependency>
	<groupId>org.springframeworkgroupId>
	<artifactId>spring-context-supportartifactId>
	<version>4.3.21.RELEASEversion>
dependency>

2.创建freemarker变量文件

freemarker-var.properties
Freemarker教程1(基本使用)_第1张图片

3.配置视图解析器

<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"
	xmlns:mvc="http://www.springframework.org/schema/mvc"
	xsi:schemaLocation="http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.3.xsd
		http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
		http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.3.xsd">

	
	<mvc:annotation-driven>mvc:annotation-driven>
	
	<context:component-scan base-package="com.dpb.controller">
		
		<context:include-filter type="annotation"
			expression="org.springframework.stereotype.Controller" />
	context:component-scan>

	
	
	<bean
		class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer">
		<property name="locations">
			<list>
				<value>classpath:freemarker-var.propertiesvalue>
			list>
		property>
	bean>
	
	<bean
		class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
		
		<property name="templateLoaderPath" value="/WEB-INF/ftl/" />
		
		<property name="defaultEncoding" value="utf-8" />
		
		<property name="freemarkerVariables">
			<map>
				<entry key="root" value="${root}">entry>
			map>
		property>
		
		<property name="freemarkerSettings">
			<props>
				<prop key="template_update_delay">10prop>
				<prop key="locale">zh_CNprop>
				<prop key="datetime_format">yyyy-MM-dd HH:mm:ssprop>
				<prop key="date_format">yyyy-MM-ddprop>
				<prop key="time_format">HH:mm:ssprop>
				<prop key="number_format">#.####prop>
			props>
		property>
	bean>
	
	<bean
		class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver">
		
		<property name="viewClass"
			value="org.springframework.web.servlet.view.freemarker.FreeMarkerView" />
		
		<property name="suffix" value=".ftl" />
		
		<property name="allowRequestOverride" value="true" />
		<property name="allowSessionOverride" value="true" />
		<property name="exposeRequestAttributes" value="true" />
		<property name="exposeSessionAttributes" value="true" />
		<property name="contentType" value="text/html;charset=utf-8" />
	bean>
beans>

4.测试

在WEB-INF下创建 index.ftl
Freemarker教程1(基本使用)_第2张图片
controller跳转到index.ftl页面

@Controller
public class UserController {

	@RequestMapping("/hello")
	public String hello(){
		return "index";
	}
}

http://localhost:8082/freemarker01/hello
Freemarker教程1(基本使用)_第3张图片

插值规则

通用插值

字符串,数字,Boolean型,Date类型

@RequestMapping("/hello")
public String hello(Model m){
	m.addAttribute("name", "张三");
	m.addAttribute("age", 18);
	m.addAttribute("enable", true);
	m.addAttribute("birth",new Date());
	return "index";
}

<html>
<head>
<meta charset="UTF-8">
<title>Insert title heretitle>
head>
<body>
	<h1>Hello Freemarkerh1>
	${root}<br>
	<hr>
	${name}<br>
	${age}<br>
	<#-- 转换规则  -->
	${enable?string("true","false")}<br>
	${birth?string("yyyy-MM-dd")}<br>
body>
html>

Freemarker教程1(基本使用)_第4张图片

数字格式化插入

数字格式化插值可采用#{expr;format}形式来格式化数字,其中format可以是:
mX:小数部分最小X位
MX:小数部分最大X位

<#--定义变量-->
<#assign x=3.9876543>
<#assign y=6>
#{x;M2}<#--显示3.99--><br>
#{y;M2}<#--显示6--><br>
#{x;m3}<#--显示3.988--><br>
#{y;m3}<#--显示6.000--><br>

Freemarker教程1(基本使用)_第5张图片

eclipse安装Freemarker插件

Freemarker教程1(基本使用)_第6张图片
重启即可

注意创建项目的编码方式一定要指定为UTF-8.不然ftl中指定的常量会乱码!!!
Freemarker教程1(基本使用)_第7张图片

你可能感兴趣的:(Freemarker)