Hogan模板

hogan模板引擎

github地址：https://github.com/twitter/hogan.js
参考作者： Rosen_Gao

语法

实例 解释 {{data}} 转译变量 {{{data}}} 不转译变量 {{!This is a comment}} 注释 {{#list}} html code{{/list}} 便利list列表 {{^list}} text{{/list}} list列表不存在时显示的内容 {{.}} 枚举当前变量

安装使用

• {{{data}}} 无转译
• {{!data}} 注释
• {{}}数学公式
• UML序列图和流程图
• 离线写博客
• 导入导出Markdown文件
• 丰富的快捷键

---

安装使用

npm install hogan.js  --save-dev

使用：

common.js中使用，例如：

// 引入hoganvar hogan = require('hogan.js');// 渲染所需模板var template = '<div>Hey! I am {{name}}!</div>';// 渲染所需数据var data = {    name : 'Rosen'};// 模板的编译var compiledTemplate = hogan.compile(template);// 模板的渲染var result = compiledTemplate.render(data);// 输出结果 console.log(result); // output: <div>Hey! I am Rosen!</div>

{{.}}代表枚举类型里的当前元素，枚举类型没有索引名，只能用{{.}}:

// 数据:{    list : ['Rosen', 'JIM']}// {{.}}用法：{{#list}}    <span>{{.}}</span>{{/list}}// 结果：<span>Rosen</span><span>JIM</span>

{{{name}}} 无转意:

// 数据：{ name : '<span color="red">Rosen</span>' };// 模板<div>Hey! I am {{{name}}}!</div>// 结果<div>Hey! I am <span color="red">Rosen</span>!</div>