FreeMarker 知识点笔记

丘耳
0 阅读1分钟

FreeMarker是一款模板引擎，它基于模板和要改变的数据生成输出文本，如HTML网页、电子邮件、配置文件、源代码等。作为前端开发工程师，了解FreeMarker可以帮助我们更好地与后端进行数据交互和页面渲染。

FreeMarker的语法丰富且功能强大，它提供了一系列指令、插值、表达式和内置函数，用于在模板中动态生成文本内容。

FreeMarker主要语法及用法

1. 文本

直接输出的静态文本，不需要任何特殊标记。

Hello, World!

2. 注释

使用<#-- ... -->来添加不会出现在最终输出中的注释。

<#-- 这是一个注释 -->

3. 插值

使用${...}来输出数据模型中的变量值。

${user.name}

也可以使用#{...}进行数字格式化或表达式计算。

#{price;M2}

4. 指令

  • ‌assign‌：用于在模板中定义变量。
<#assign name="John Doe">
  • ‌if/elseif/else‌：用于条件判断。
<#if user.loggedIn>
    Welcome, ${user.name}!
<#else>
    Please log in.
</#if>
  • ‌list/break/continue‌：用于遍历集合。
<#list users as user>
    ${user.name}<br>
    <#if user.isAdmin><#break></#if>
</#list>
  • ‌include‌：包含另一个模板的内容。
<#include "header.ftl">
  • ‌import‌：导入另一个模板中定义的宏。
<#import "macros.ftl" as m>
  • ‌macro‌：定义一个可重用的模板片段（宏）。
<#macro greet name>
    Hello, ${name}!
</#macro>
  • ‌nested‌：与macro指令结合使用，表示宏中的嵌套内容。
<@m.greet name="Jane">
    <p>This is nested content.</p>
</@m.greet>
  • ‌setting‌：设置FreeMarker的行为，如输出格式、错误处理等。
<#setting output_format="HTML">

5. 表达式

表达式可以在插值或指令中使用，支持算术运算、逻辑运算、比较运算等。

${user.age + 1}
${user.name == "Admin"}

6. 内置函数

FreeMarker提供了一系列内置函数，用于字符串处理、日期格式化、集合操作等。

${user.name?upper_case}
${today?date}
${users?size}

复杂HTML模板示例

以下是一个包含上述所有语法引用的复杂HTML模板示例：

<!DOCTYPE html>
<html>
<head>
    <title>${title}</title>
    <#setting output_format="HTML">
</head>
<body>
    <#-- 包含头部模板 -->
    <#include "header.ftl">

    <#-- 使用assign指令定义变量 -->
    <#assign username="JohnDoe">
    <#assign isLoggedIn=true>
    <#assign userRoles=["user", "admin"]>

    <#-- 条件判断 -->
    <#if isLoggedIn>
        <p>Welcome, ${username}!</p>
        <#if userRoles?seq_contains("admin")>
            <p>You have administrative privileges.</p>
        </#if>
    <#else>
        <p>Please <a href="login.html">log in</a>.</p>
    </#if>

    <#-- 列表遍历 -->
    <ul>
        <#list userRoles as role>
            <li>${role}</li>
        </#list>
    </ul>

    <#-- 宏定义与调用 -->
    <#macro displayMessage message>
        <p style="color: ${message.color};">${message.text}</p>
    </#macro>

    <@displayMessage message={"color": "red", "text": "This is an error message."}/>

    <#-- 使用内置函数 -->
    <p>Current date and time: ${.now?datetime}</p>
    <p>Uppercase username: ${username?upper_case}</p>

    <#-- 包含底部模板 -->
    <#include "footer.ftl">
</body>
</html>

在这个模板中，使用了FreeMarker 的主要语法，包括文本输出、注释、插值、指令（assign、if、list、include、macro）、表达式和内置函数。

avatar
文章
阅读
粉丝