freemarker标签使用及配置

经过一段时间的钻研,freemarker确实比jsp好用,freemarker严格划分了mvc模式。以填充模板的方式展示到页面。下面介绍下本人经历的freemarker使用及配置,配置标签对项目的维护性和扩展性好。


创建freemarker配置,web.xml加载一下

创建 springmvc-freemarker.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.2.xsd"
	default-lazy-init="true">  
	
   <!-- 配置freeMarker的模板路径 -->  
     <bean class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">  
        <property name="templateLoaderPath" value="WEB-INF/web/templates/" />  
        <property name="defaultEncoding" value="UTF-8" /> 
         <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="number_format">#.##</prop>  
                <prop key="tag_syntax">auto_detect</prop>  
            </props>  
        </property>   
         <!-- 假设你需要使用freemarker的自定义标签,这里还需要增加这一段 -->  
	    <property name="freemarkerVariables">  
	        <map>  
	       		<entry key="imgResUrl" value-ref="img_res_url" />
	        </map>     
	    </property>  
     </bean> 
     
     <!-- 自定义标签访问路径 -->
     <bean id="img_res_url" class="com.icbc.app.freemarker.CmsCommonDirective">
     	<property name="tagType" value="imgResUrl" />
     </bean>
     <!-- freemarker视图解析器 -->  
     <bean class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver">  
	     <property name="contentType" value="text/html;charset=UTF-8" />  
        <!-- 此变量值为pageContext.request, 页面使用方法:rc.contextPath -->  
        <property name="requestContextAttribute" value="rc" />  
     </bean>  
</beans>


<property name="templateLoaderPath" value="WEB-INF/web/templates/" />   //value值代表的controller返回的html,默认前缀的路径

<prop key="tag_syntax">auto_detect</prop>  // tag_syntax 代表html页面渲染的时候,标签使用[#if ]的模式,还有一种是<#if>,个人觉得[#if]比较好用,因为不会和html的标签冲突。


<property name="freemarkerVariables">  
	<map>  
		<entry key="imgResUrl" value-ref="img_res_url" />
	</map>     
</property> 
//key="imgResUrl" 表示页面自定义标签的名称
//value-ref="img_res_url" 自定义标签访问路径

<bean id="img_res_url" class="com.icbc.app.freemarker.CmsCommonDirective">
   <property name="tagType" value="imgResUrl" />
</bean>
id="img_res_url" //就是上面 value-ref="img_res_url" 链路下来的
class="com.icbc.app.freemarker.CmsCommonDirective" //表示自定义标签访问的类,类里面可以配置标签的作用
<property name="tagType" value="imgResUrl" /> //表示此标签的名称为  imgResUrl


创建配置文件,common.properties

##图片路径
img_res_url=/images/resources


创建CmsCommonDirective.java

package com.icbc.app.freemarker;

import java.io.IOException;
import java.io.Writer;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;

import com.icbc.app.common.utils.CmsUtils;
import com.icbc.app.constants.Constants;
import com.icbc.app.constants.Constants.Tag;
import com.icbc.app.web.utils.AppConfig;

import freemarker.core.Environment;
import freemarker.template.ObjectWrapper;
import freemarker.template.SimpleSequence;
import freemarker.template.TemplateDirectiveBody;
import freemarker.template.TemplateDirectiveModel;
import freemarker.template.TemplateException;
import freemarker.template.TemplateModel;

public class CmsCommonDirective implements TemplateDirectiveModel {

	private String tagType = null;

	@SuppressWarnings("rawtypes")
	@Override
	public void execute(Environment env, Map params, TemplateModel[] loopVars, TemplateDirectiveBody body)throws TemplateException, IOException
	{
		if (Tag.IMG_RES_URL.equals(tagType))//图片路径 Tag.IMG_RES_URL 是在常量池定义的

		{
			try 
			{
				renderImgResUrl(env, params, loopVars, body);
			} catch (Exception e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			}
		}
		
	}
	
	@SuppressWarnings("rawtypes")
	private void renderImgResUrl(Environment env, Map params, TemplateModel[] loopVars, TemplateDirectiveBody body)
			throws Exception
	{
		Writer out = env.getOut();
		AppConfig loader = new AppConfig();
		out.write(loader.getPropertiesByName("img_res_url"));//获取配置文件里面图片前缀路径,将标签的值设置成properties设置的值
	}
	public String getTagType()
	{
		return tagType;
	}

	public void setTagType(String tagType)
	{
		this.tagType = tagType;
	}
}


创建controller

package com.icbc.app.controller;


import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import com.icbc.app.web.utils.FrontUtils;
/**
 *
 * @ClassName:  LoginController   
 * @Description:TODO  
 * @author: 何俊辉
 * @date:   2017年7月4日 上午10:48:12   
 *     
 * @Copyright: 2017 
 *
 */
@Controller
public class MemberController {
	private final Log logger = LogFactory.getLog(this.getClass());
	
	
	private static final String ICBC_INDEX = "index.html";
	
	
	/**
	 * 首页GET
	 * @Title: icbcLogin_GET   
	 * @Description: TODO 访问页面需先访问controller的get方法,get方法返回的是页面
	 * @param: @param request
	 * @param: @param response
	 * @param: @param model
	 * @param: @return      
	 * @return: String      
	 * @throws
	 */
	@RequestMapping(value="/icbc/index.htm",method = RequestMethod.GET)
	public String icbcIndex_GET(HttpServletRequest request,HttpServletResponse response,ModelMap model,String userId,String time)
	{
		model.addAttribute("test1","test1");
		
		return FrontUtils.findFrontTpl(request, response, model, ICBC_INDEX);
	}
	
}

创建index.html页面

[@compress single_line=true]<!-- 此代码将输出压缩为一行。都需要包裹所需文档 -->
[#assign headerTitle = 'APP首页']<!-- 此代码是用于页面标题 -->
[#include "/common/header.html"/]<!-- 此代码是引用公用头部 -->
<link rel="stylesheet" href="${base}/template/index/css/skin.css" />
<section class="main">
<div class="mui-slider" id="slider" style="width:100%;height:200px"> 
	<div>刚刚配置的标签为:[@imgResUrl /] 通过model传出的参数:${test}</div>
</div>
</section>
</body>
</html>
[/@compress]


页面效果:


写博客没多久,写的比较烂,多多包涵。

如有什么疑问可以联系我:qq:714382619

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值