简介

FreeMarker是模板引擎，一个Java类库。

  • 模板编写为FreeMarker Template Language (FTL)

    这种方式通常被称为MVC (模型 视图 控制器) 模式。它可以帮助从开发人员（Java程序员）中分离出网页设计师（HTML设计师）。

入门：

1. 模板+数据模型 = 输出

1.1. 数据模型

  • 在模板文件放在Web服务器之后，就像动态网页一样，当有人访问该页面，FreeMarker会动态的转换模板，替换${}部分，之后将结果发送至访问者的Web浏览器中。
  • 保证模板专注于显示问题(视觉设计，布局和格式化)是高效使用模板引擎的关键。
  • 为模板准备的数据整体被称作为 数据模型，数据模型就是各种数据的集合（可以理解为树形结构），这些数据可以通过一些getxx方法获取。

1.2. 数据结构

  • 如果是序列数据，则采用xx.xxx[0]的访问方式

2. 指令

2.1. 基本指令

  • ${}这样的表达式称作interpolation(插值）
  • FTL标签（即指令）以#开头
  • FTL注释不会出现在输出中（页面）

2.1.1. if指令的使用示例

<#if animals.python.price < animals.elephant.price>
  Pythons are cheaper than elephants today.
<#elseif animals.elephant.price < animals.python.price>
  Elephants are cheaper than pythons today.
<#else>
  Elephants and pythons cost the same today.
</#if>

2.1.2. list指令的使用示例

<p>We have these animals:
<table border=1>
  <#list animals as animal>
    <tr><td>${animal.name}<td>${animal.price} Euros
  </#list>
</table>

输出如下：

<p>We have these animals:
<table border=1>
    <tr><td>mouse<td>50 Euros
    <tr><td>elephant<td>5000 Euros
    <tr><td>python<td>4999 Euros
</table>

2.1.3. include指令的使用示例

当我们需要将页面的某一部分多次展示时，就可以将它视为一个“模板”,比如左边的菜单，其代码放在一个leftMenu.ftl中，然后在主页面ftl中引入它。
leftMenu.ftl

<div class="page-sidebar">
<div class="sidebar-menugroup">
    <div class="sidebar-grouptitle">个人中心</div>
    <ul class="sidebar-menu">
        <li class="sidebar-menuitem"><a href="notifications">最新通知</a></li>
        <li class="sidebar-menuitem active"><a href="mybookings">我的预定</a></li>
        <li class="sidebar-menuitem"><a href="mymeetings">我的会议</a></li>
    </ul>
</div>

main.ftl

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    ...
    <#include '*/leftMenu.ftl'>
    ...
</body>
</html>

2.1.4.联合使用指令
指令间可以很容易地相互嵌套。

2.1.5.使用内建函数
包括首字母大写、大写、给出项目个数等方法。

  • animal.name?cap_first 给出 animal.name的首字母大写版本
  • user?upper_case 给出 user 值的大写版本
  • animals?size 给出 animals 序列中项目的个数

2.1.6.处理不存在的变量
?? 来询问一个变量是否存在。如果user变量不存在，则会忽略“问候”的代码段。

<#if user??><h1>Welcome ${user}!</h1></#if>