项目笔记learn10（Freemarker）

FreeMarker与 Web 容器无关，即在 Web 运行时，它并不知道 Servlet 或 HTTP。

1.引入依赖

<dependency>
		<groupId>org.freemarker</groupId>
		<artifactId>freemarker</artifactId>
		<version>2.3.23</version>
</dependency>  

2.模板文件中四种元素:

1、文本，直接输出的部分
2、注释，即<#–…-->格式不会输出
3、插值（Interpolation）：即${…}部分,将使用数据模型中的部分替代输出
4、FTL指令：FreeMarker指令，和HTML标记类似，名字前加#予以区分，不会输出。

3.FTL指令

1.assign:用于在页面上定义一个变量(对象)

<#assign info={"mobile":"13301231212",'address':'北京市昌平区王府街'} >
电话：${info.mobile}  地址：${info.address}

2.include：用于引入模板

<#include "head.ftl">

3.if：条件判断

<#if success=true>
  你已通过实名认证
<#else>  
  你未通过实名认证
</#if>

4.list：循环

<#list goodsList as goods>
  ${goods_index+1} 商品名称： ${goods.name} 价格：${goods.price}<br>
</#list>

想在循环中得到索引，使用循环变量+_index就可以得到

4.内建函数

1.获取集合大小：

共  ${goodsList?size}  条记录

2.json字符串转换为对象：

<#assign text="{'bank':'工商银行','account':'10101920201920212'}" />
	<#assign data=text?eval />
	开户行：${data.bank}  账号：${data.account}

3.缺失变量默认值：

  ${a!'-'}      当a为null则返回！后边的内容-

4.运算符
逻辑运算符只能作用于布尔值,否则将产生错误
gt或者>:判断左边值是否大于右边值
It或者<:判断左边值是否小于右边值

5.配置文件

1.spring配置文件

<bean id="freemarkerConfig"	class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
		<property name="templateLoaderPath" value="/WEB-INF/ftl/" />
		<property name="defaultEncoding" value="UTF-8" />
	</bean>

2.文件生成目录：page.properties

pagedir=d:\\item\\

注入：

@Value("${pagedir}")
private String pagedir;

@Autowired
private FreeMarkerConfig freeMarkerConfig;

放入数据生成文件：

Configuration configuration = freeMarkerConfig.getConfiguration();
			Template template = configuration.getTemplate("item.ftl");
			Map dataModel=new HashMap<>();			
			//1.加载商品表数据
			TbGoods goods = goodsMapper.selectByPrimaryKey(goodsId);
			dataModel.put("goods", goods);			
			//2.加载商品扩展表数据			
			TbGoodsDesc goodsDesc = goodsDescMapper.selectByPrimaryKey(goodsId);
			dataModel.put("goodsDesc", goodsDesc);						
			Writer out=new FileWriter(pagedir+goodsId+".html");
			template.process(dataModel, out);
			out.close();

6修改前台页面：

<div class="news"><span>${goods.caption}</span></div>

<div class="fl price"><i>¥</i><em>${goods.price}</em><span>降价通知</span></div>

<div class="intro-detail"><!-- 商品详情 -->	${goodsDesc.introduction}</div>

<div id="two" class="tab-pane"><p>${goodsDesc.packageList}</p></div>
<div id="three" class="tab-pane"><p>${goodsDesc.saleService}</p></div>

例：生成图片列表：

<#--图片列表 -->
<#assign imageList=goodsDesc.itemImages?eval />

<!--默认第一个预览-->
<div id="preview" class="spec-preview">
		<span class="jqzoom">
				<#if (imageList?size>0)>
					<img jqimg="${imageList[0].url}" src="${imageList[0].url}" width="400px" height="400px" />
				</#if>
		</span>
</div>
<!--下方的缩略图--><div class="spec-scroll">
		<div class="items">
		<ul>
		<#list imageList as item>
			<li><img src="${item.url}" bimg="${item.url}" onmousemove="preview(this)" /></li>
		</#list>
		</ul>
	</div>
</div>