SpringMVC + Freemarker 模版的使用。

soゝso 2016-08-22 18:24:36 6599

最近2年,接触的公司, Java  的View层,大多都是在使用模版语言,更多的在使用 Freemarker  。更多 Freemarker  信息请点击: Freemarker 

后面我会介绍 Freemarker  更多的东西。更多我亲身体验的东西。今天就说下 Freemarker  做模版怎么使用。

以前我们用Ajax有2种方式:

  1. 通过 Ajax  从后台获取数据,返回前端页面,然后循环拼接字符串。
  2. 通过 Ajax  请求后台,后台拼接字符串成Html代码,返回前端直接展示。

无外乎这2中做法。那么有什么缺点呢?

  1. Javascript  写一堆Html拼接。杂、乱、尤其是 Javascript  功底不好的同学,N多错误,代码不讲究的同学,写完后别人看见就想吐。
  2. Java  代码拼接Html代码一直是广大优质 Java  程序员所唾弃的,当然,JSP里写 Java  代码也是要被鄙视的。

进入主题,我们今天要使用Freemarker这个模版语言来返回Html代码,前端Ajax请求后直接显示。

Freemarker模版文件代码:

<ul class="cf">
	<#if list?exists && list?size gt 0>
		<#list list as it>
			<li>
				<a class="pic fancybox" href="${it.url}" title="${it.fileName}">
					<img src="${it.url}" />
				a>
				<span class="myCouse_inf">
					<h2><a href="javascript:void(0);">${it.fileName}a>h2>
					<h3>
						<a class="toux_sw" href="/member.html">
							<img src="${it.userPic}" />${it.userName}
						</a>
						<a style="margin-left: 15px;" class=" icon_lev fancybox icon_lev2" 
						title="${it.fileName}" href="${it.url}">预览</a>
					</h3>
				</span>
				</a>
			</li>
		</#list>
		
	<#else>
		<li style="width: 100%;">
			<p style="display: block; text-align: center; font-size: 3em;
				 height: 80px; line-height: 80px;">
				你没有分享任何信息,赶快分享你的作品吧。
			</p>
		</li>
	</#if>
	
<#if pageHtml?exists>
	<div class="pages">
		${pageHtml}
	</div>
</#if>


下面是Controller代码,使用的是 SpringMVC 

/**
	 * 加载评论
	 * @param key
	 * @param pageNo
	 * @param pageSize
	 * @return
	 */
	@RequestMapping(value="comment/loadMessage",method=RequestMethod.POST)
	@ResponseBody
	public void loadMessage(String targetKey,Integer pageNo,Integer pageSize,
			HttpServletResponse response){
		Pagination<MessageComment> page = 
			commentMessageService.findCommentByKey(targetKey, pageNo, pageSize);
		resultMap.put("list", page.getList());
		resultMap.put("targetKey", targetKey);
		String ftl = "message/comment/comment_template.ftl";
		FreemarkerOutHTMLUtils.outHtml(response,ftl , resultMap);
	}


下面是工具类代码:

public class FreemarkerOutHTMLUtils {
	static Configuration cfg = Ferrmarker.cfg;
	
	static {
		// 初始化FreeMarker配置
		// 创建一个Configuration实例
		//cfg = new Configuration();
		// 设置FreeMarker的模版文件位置WEB-INF/templates
	}

	public static void outHtml(HttpServletResponse response,String path,
                    Map<String,Object> parament) { try { // 取得模版文件 Template t = cfg.getTemplate(path); // 开始准备生成输出 // - 使用模版文件的charset作为本页面的charset // - 使用text/html MIME-type response.setContentType("text/html; charset=" + t.getEncoding());// + Writer out = response.getWriter(); parament.putAll(Ferrmarker.initMap);//加载配置 // 合并数据模型和模版,并将结果输出到out中 t.process(parament, out); } catch (Exception e) { LoggerUtils.fmtError(FreemarkerOutHTMLUtils.class,e,"处理模版中出现错误"); } } }


还有关键的一步,Freemarker配置设置,这里有很多种方式实现:

public static Map<String,Object> initMap = new LinkedHashMap<String,Object>() ;
	
	static {
		/**Freemarker Config*/
		//1、创建Cfg
		cfg = new Configuration();
		//2、设置编码
		cfg.setLocale(Locale.getDefault()) ;
		cfg.setEncoding(Locale.getDefault(),"UTF-8") ;
		
		/**添加自定义标签*/
		APITemplateModel api = SpringContextUtil.getBean("api",APITemplateModel.class);
		cfg.setSharedVariable("api", api);
		
		FreeMarkerConfigExtend ext = 
                    SpringContextUtil.getBean("freemarkerConfig",FreeMarkerConfigExtend.class); Configuration vcfg = ext.getConfiguration(); Set<String> keys = vcfg.getSharedVariableNames(); for (String key : keys) { TemplateModel value = vcfg.getSharedVariable(key); cfg.setSharedVariable(key, value); } try { FreeMarkerConfigExtend.putInitShared(cfg); } catch (TemplateModelException e) { logger.error("添加Freemarker自定义方法失败;" ,e); } try { cfg.setDirectoryForTemplateLoading(new File(freemarkerPath)); } catch (IOException e) { LoggerUtils.fmtError(Ferrmarker.class,e, "加载Freemarker 目录失败%s", freemarkerPath); } IUser token = TokenManager.getToken(); initMap.put("token", token); initMap.put("_time", new Date().getTime()); initMap.put("NOW_YEAY", Constant.NOW_YEAY); initMap.put("_v", Constant.VERSION);//版本号,重启的时间 initMap.put("domain_static", Constant.DOMAIN_STATIC);//后台域名 }


前端代码呢?

var data = {"userId":"${token.id}",pageNo:"${pageNo?default(1)}"};
$.post("/ishare/loadShare.shtml",data,function(html){
	$("#outHtml").html(html);
});

ps:这就解决了,有疑问的联系我,知无不答,后面我有时间,开一个Freemarker专讲。


版权所属:SO JSON在线解析

原文地址:https://www.sojson.com/blog/39.html

转载时必须以链接形式注明原始出处及本声明。

本文主题:

如果本文对你有帮助,那么请你赞助我,让我更有激情的写下去,帮助更多的人。

相关文章
SpringMVC + Freemarker 模版使用
Shiro教程(八)Shiro Freemarker标签的使用
Freemarker静态化加载板的三种方式
Javascript块化编程,本站使用 require.js 优化JS加载, require.js下载
Java生成验证码合集(一)简单
Freemarker Macro Demo
多说迁移,Java开发仿自主实现评论(一)
Elasticsearch教程(三),IK分词器安装 (极速
Java 解析JSON,JSON-LIB jar包下载和使用
Freemarker教程,Freemarker 自定义方法 【含源码】
最新文章
Macbook teamviewer 突破5分钟,苹果电脑重置 Mac 地址,100%解决限制 271
腾讯云代金券 10000 元/ 30000 代金券领取技巧 351
SEO 换友情链接的主意事项,友情链接断链、友情链接套路说明 236
Springboot + Mybatis,数据库多数据源配置项目Demo【源码下载】 1934
Mac mtr 安装并使用,mrt: command not found 301
Java 集成阿里云消息队列,日志消息存储 501
域名备案注意事项,网站域名ICP备案快速通过攻略【干货分享】 487
Springboot 集成Aliyun MQ消息队列,Aliyun 消息队列配置及代码实现 842
SpringBoot 集成Spring-data-redis,redis对象序列化存储 2050
天气API,全国天气 JSON API接口,可以获取十五天的天气预报 616
最热文章
Elasticsearch教程(四) elasticsearch head 插件安装和使用 126843
免费天气API,全国天气 JSON API接口,可以获取五天的天气预报 108648
Elasticsearch教程(六) elasticsearch Client创建 78834
Elasticsearch教程(八) elasticsearch delete 删除数据(Java) 74451
Elasticsearch教程(二),IK分词器安装 73235
Elasticsearch教程(一),全程直播(小白级别) 65840
Elasticsearch教程(五) elasticsearch Mapping的创建 61925
Elasticsearch教程(三),IK分词器安装 (极速版) 56373
Elasticsearch教程(七) elasticsearch Insert 插入数据(Java) 53569
Java 解析JSON,JSON-LIB jar包下载和使用。 49041

骚码加入我们 / 千人QQ群:259217951

入群需要5元,如果没有QQ钱包,可以先Alipay、微信,赞助然后加群主拉进。

二维码生成 来自 >> 二维码生成器

支付扫码

所有赞助/开支都讲公开明细,用于网站维护:赞助名单查看

正在加载... ...