Freemarker教程1(基本使用)

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


简介

 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.freemarker</groupId>
  <artifactId>freemarker</artifactId>
  <version>2.3.28</version>
</dependency>
<!-- freemarker中必须依赖spring-context-support -->
<dependency>
  <groupId>org.springframework</groupId>
  <artifactId>spring-context-support</artifactId>
  <version>4.3.21.RELEASE</version>
</dependency>

2.创建freemarker变量文件

freemarker-var.properties

image.png

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">
    <!-- 只扫描指定路径下的controller注解 -->
    <context:include-filter type="annotation"
      expression="org.springframework.stereotype.Controller" />
  </context:component-scan>
  <!-- 配置freemarker -->
  <!-- 1.引入freemarker属性文件 -->
  <bean
    class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer">
    <property name="locations">
      <list>
        <value>classpath:freemarker-var.properties</value>
      </list>
    </property>
  </bean>
  <!-- 2.定义模板属性 -->
  <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">10</prop>
        <prop key="locale">zh_CN</prop>
        <prop key="datetime_format">yyyy-MM-dd HH:mm:ss</prop>
        <prop key="date_format">yyyy-MM-dd</prop>
        <prop key="time_format">HH:mm:ss</prop>
        <prop key="number_format">#.####</prop>
      </props>
    </property>
  </bean>
  <!-- 3.配置视图解析器 -->
  <bean
    class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver">
    <!-- 生成view的类 -->
    <property name="viewClass"
      value="org.springframework.web.servlet.view.freemarker.FreeMarkerView" />
    <!-- 配置后缀 -->
    <property name="suffix" value=".ftl" />
    <!-- 支持request覆盖model -->
    <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

image.png

controller跳转到index.ftl页面

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

http://localhost:8082/freemarker01/hello

image.png

插值规则

通用插值

字符串,数字,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";
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
  <h1>Hello Freemarker</h1>
  ${root}<br>
  <hr>
  ${name}<br>
  ${age}<br>
  <#-- 转换规则  -->
  ${enable?string("true","false")}<br>
  ${birth?string("yyyy-MM-dd")}<br>
</body>
</html>

image.png

数字格式化插入

数字格式化插值可采用#{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>

image.png

eclipse安装Freemarker插件

image.png

重启即可

注意创建项目的编码方式一定要指定为UTF-8.不然ftl中指定的常量会乱码!!!

image.png



相关文章
|
1月前
|
XML 前端开发 Java
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
Spring Boot的Web开发之Thymeleaf模板引擎的解析及使用(Thymeleaf的基础语法以及常用属性)
80 0
|
8月前
|
存储 JavaScript 前端开发
Thymeleaf入门教程
Thymeleaf入门教程
95 0
QGS
|
缓存 JavaScript 前端开发
浅浅入门SpringBoot之Thymeleaf模板
Thymeleaf是一个流行的模板引擎,该模板引擎采用Java语言开发模板引擎是一个技术名词,是跨领域跨平台的概念,在Java语言体系下有模板引擎,在C#、PHP语言体系下也有模板引擎,甚至在 Javascript中也会用到模板引擎技术,Java生态下的模板引擎有 Thymeleaf、 Freemaker、Ⅴ elocity、 Beetl(国产)等。
QGS
177 0
浅浅入门SpringBoot之Thymeleaf模板
|
XML 移动开发 前端开发
【JavaWeb】Thymeleaf的简介与使用(上)
【JavaWeb】Thymeleaf的简介与使用(上)
【JavaWeb】Thymeleaf的简介与使用(上)
|
XML Java 程序员
模板引擎:第一章:FreeMarker
模板引擎:第一章:FreeMarker
174 0
模板引擎:第一章:FreeMarker
|
Java 程序员 Maven
模板引擎:第二章:Thymeleaf
模板引擎:第二章:Thymeleaf
136 0
模板引擎:第二章:Thymeleaf
|
存储 前端开发
【JavaWeb】Thymeleaf的简介与使用(下)
【JavaWeb】Thymeleaf的简介与使用(下)
|
Java 程序员 Apache
模板引擎——FreeMarker初体验
FreeMarker 是一款模板引擎:一种基于模板的、用来生成输出文本(任何来自于 HTML格式的文本用来自动生成源代码)的通用工具。
|
Web App开发 安全 Java
一篇很全面的freemarker教程
FreeMarker的模板文件并不比HTML页面复杂多少,FreeMarker模板文件主要由如下4个部分组成: 1,文本:直接输出的部分 2,注释:格式部分,不会输出 3,插值:即${...}或#{..
1775 0
|
移动开发 Java HTML5
Thymeleaf 5 分钟教程
Thymeleaf 是一个用于 web 和独立环境的现代服务器端 Java 模板引擎。 Thymeleaf 的主要目标是为开发工作流程带来优雅的自然模板ー HTML,它既可以在浏览器中正确显示,也可以作为静态原型工作,从而加强开发团队之间的协作。 有了 Spring Framework 的模块、大量与您最喜欢的工具集成的功能,以及插入您自己功能的能力,Thymeleaf 是现代 HTML5 JVM web 开发的理想选择ーー尽管它可以做的还有很多。 用 Thymeleaf 语言编写的 HTML 模板看起来和工作方式仍然类似于 HTML,使得在应用程序中运行的实际模板仍然可以作为有用的设计工件工
157 0