[FreeMarker 2.3.20] Part I 关于模版设计的介绍 ~准备阶段~ Template + data-model = output

简要说明


这一章节主要是对FreeMarker做个简要的介绍,后边章节会有更加细致的认识。不过可以确定的是,在看过这个章节后你就能够写简单但是很有帮助的FreeMarker模板了。

模板 + data-model = 输出

假设下边是一个电商的 HTML 页面,大概像这个样子:

<html>
<head>
  <title>Welcome!</title>
</head>
<body>
  <h1>Welcome Big Joe!</h1>
  <p>Our latest product:
  <a href="products/greenmouse.html">green mouse</a>!
</body>
</html>  

	
现在我们考虑在 Welcome 后边的人名 ("Big Joe") 是根据实际登录网站页面的用户决定的,而且最新的商品是从数据库中取出来的,那么也就意味着这个商品的值可能随时会改变。那么在这样的条件下我们就不能仅仅只是输入一个确切的人名和最新的商品信息了,换句话说,不能是静态页面。

这个问题 FreeMarker 是能够解决的,它的解决方式是通过它的模板文件来替换这个静态文件。虽然这个模板文件表面上看起来和静态 HTML 文件类似,但是有点是例外的,里边包含了 FreeMarker 让这个文件变为动态文件的指令:

<html>
<head>
  <title>Welcome!</title>
</head>
<body>
  <h1>Welcome ${user}!</h1>
  <p>Our latest product:
  <a href="${latestProduct.url}">${latestProduct.name}</a>!
</body>
</html>  

这个文件如同通常的静态 HTML 文件一样是存储在服务端的,但是只要有人访问这个页面时,FreeMarker就会介入啦,它会用最新的数据来替换掉模板中 ${...}标记的内容 (比如将${user}的内容替换为  "Big Joe" 或者是其他登录用户的用户名),将指定的模板转换为一般的 HTML 文件并发送到访问者的浏览器中。其实这个时候访问者接收到的数据就如同第一个例子一样的 HTML 文本( 没有任何 FreeMarker 指令的普通 HTML 文本),自然访问者也不会意识到这个时候 FreeMarker 帮忙生成了这个 HTML。在这样一个生成的过程中,存储在服务端的那个模板文件并没有被改变过,所以在每一次的访问中这个生成过程是不断发生的。这样的过程其实也就保证了显示的信息始终是最新的。

当然,或许你已经注意到这个模板里边并没有包含如何去获取谁是当前访问者的相关指令,以及如何通过查询数据库来获取最新的商品信息,就好像 FreeMarker 老早就知道了这些个数据了。其实这就是问题的关键,一个隐藏在 FreeMarker 后边 (或者说,这也是 MVC 所蕴含)的重要思想,将展现层逻辑和业务层逻辑分离。在模板中你只需要关注有关显示方面的问题,比如说视觉设计、格式设计等问题,而那些被显示的具体数据 (就像上边的 用户名和最新产品) 是在 FreeMarker 之外就被准备好了,一些我们所熟知的语言如Java等。因此呢,如果我们是模板设计者那么我们就不需要去关心这些被显示的具体数据是如何产生的了。这里有个关键的概念,无论这些显示的数据是通过多么复杂的逻辑产生的,依然,用来呈现它们的模板仍然可以保持原貌【敌军围困万千重,我自岿然不动】 相反亦如此。这一招在模板设计者和程序员非同一人的情况下相当奏效。

对于 FreeMarker 和模板设计者来来说,虽然可以不用过多的纠结数据是怎么计算的,但是要用它,那么还是要了解它里边关于这些数据的一些秘密的。首先一定要记住的是模板文件能使用的数据都是被打包在一个叫data-model的地方。这些个数据呢就是由上边所提到的那些语言计算后创建的。就如模板作者所关心的,data-model 是一个树型结构 (如同存储在硬盘上的文件夹和文件), 上边例子中数据的结构如下:

(root)
  |
  +- user = "Big Joe"
  |
  +- latestProduct
      |
      +- url = "products/greenmouse.html"
      |
      +- name = "green mouse"

(以防误解:data-model 并不是一个文本文件,上边只是个便于理解的版本,对于数据结构有所了解的各位应该能明白这展示的是数据之间的关系罢了。这些都是Java对象,就让我们把这些问题留给Java程序员吧)

我们将这个和之前的例子做个比较:  ${user} ${latestProduct.name}。让我们来做个类比(analogy),这些数据模型其实和计算机的文件系统类似:rootlatestProduct就好比是文件夹,而userurlname就好比文件了。urlname是处于latestProduct文件夹中,因此可以说latestProduct.name 其实可以理解为 name 存在于 latestProduct 文件夹的。当然也正如我说的,这些只是类比啦,这里边没有文件或者文件夹什么事。

做个总结吧,很简单,对于FreeMarker来说,模版文件和 data-model 是生成输出的重要元素:

Template + data-model = output

发布了13 篇原创文章 · 获赞 5 · 访问量 6万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章