Mustache模板引擎
Mustache是一个Logic-Less模板引擎,即:零逻辑引擎,原因在于它只有标签,没有流程控制语句,这是它与其它模板引擎不同的地方。
Mustache小巧玲珑,几乎用各种语言都实现了一遍。
Mustache的用途
不仅仅用于HTML页面渲染,也可以用于配置文件、XML渲染等各种文本文件。
第一个例子
一个典型的mustache文件如下:
Hello {{name}}
You have just won {{value}} dollars!
{{#in_ca}}
Well, {{taxed_value}} dollars, after taxes.
{{/in_ca}}
给定一个哈希表:
{
"name": "Chris",
"value": 10000,
"taxed_value": 10000 - (10000 * 0.4),
"in_ca": true
}
将会产生如下结果:
Hello Chris
You have just won 10000 dollars!
Well, 6000.0 dollars, after taxes.
Mustache只有5种标签,就是这么简单
变量标签
{{username}}
默认情况下,username中的<
等符号会被转义为<
防止转义使用{{&username}}或者使用{{{username}}}
区块标签
{{#sectionVariable}}
这里是区块
{{/sectionVariable}}
区块变量可以取四种数据类型:
1、 false或者空数组:不显示区块内容
2、 非空数组:表示迭代数组中的每一项
Template:
{{#repo}}
<b>{{name}}</b>
{{/repo}}
Hash:
{
"repo": [
{ "name": "resque" },
{ "name": "hub" },
{ "name": "rip" }
]
}
Output:
<b>resque</b>
<b>hub</b>
<b>rip</b>
如果区块直接是一个字符串列表
View:
{
"musketeers": ["Athos", "Aramis", "Porthos", "D'Artagnan"]
}
Template:
{{#musketeers}}
* {{.}}
{{/musketeers}}
结果:
* Athos
* Aramis
* Porthos
* D'Artagnan
3、函数:调用一次函数
Template:
{{#wrapped}}
{{name}} is awesome.
{{/wrapped}}
Hash:
{
"name": "Willy",
"wrapped": function() {
return function(text, render) {
return "<b>" + render(text) + "</b>"
}
}
}
Output:
<b>Willy is awesome.</b>
4、字典类型:控制上下文
Template:
{{#person?}}
Hi {{name}}!
{{/person?}}
Hash:
{
"person?": { "name": "Jon" }
}
Output:
Hi Jon!
反转区块标签:用于实现else结构
Template:
{{#repo}}
<b>{{name}}</b>
{{/repo}}
{{^repo}}
No repos :(
{{/repo}}
Hash:
{
"repo": []
}
Output:
No repos :(
注释标签
{{!这里随便写点注释}}
包含标签
{{>head.mustache}}
Mustache的包含是动态包含,而不是简单地复制粘贴。
我所知道的其它模板引擎
java模板引擎
freemarker
velocity
beetl
smarty4j
httl
各种语言:
mustuche
参考资料
Mustache模板引擎的更多相关文章
- JS模板引擎-Mustache模板引擎使用实例1-表格树
1 使用实例代码 1.jsp代码 <!DOCTYPE html> <html lang="zh-CN"> <head> <title> ...
- nodejs+Express中使用mustache模板引擎
由于公司一个seo项目,需要我协助.此项目他人已经开发大半,由于seo需要,使用了服务器端模板引擎.我项目的后端同事说项目是go语音写的,跑项目麻烦,只给了我template和css等静态文件. 为了 ...
- 前端数据渲染及mustache模板引擎的简单实现
早期数据渲染的几种方式 在模板引擎没有诞生之前,为了用JS把数据渲染到页面上,诞生了一系列数据渲染的方式. 最最基础的,莫过于直接使用DOM接口创建所有节点. <div id="roo ...
- swift 之 mustache模板引擎
用法: Variable Tags {{name}} 用来渲染值name datas: let data = ["value": "test"] ------- ...
- js模板引擎mustache介绍及实例
在Javascript中 mustache.js是实现mustache模板系统. Mustache是一种没有逻辑的模板语法.它可以应用于HTML.配置文件.源代码等任何地方. 它通过使用散列或对象中提 ...
- 【转】在Express项目中使用Handlebars模板引擎
原文:http://fraserxu.me/2013/09/12/Using-Handlebarsjs-with-Expressjs/ 最近在用Expressjs做一个项目,前后端都用它来完成.自己之 ...
- Handlebars的基本用法 Handlebars.js使用介绍 http://handlebarsjs.com/ Handlebars.js 模板引擎 javascript/jquery模板引擎——Handlebars初体验 handlebars.js 入门(1) 作为一名前端的你,必须掌握的模板引擎:Handlebars 前端数据模板handlebars与jquery整
Handlebars的基本用法 使用Handlebars,你可以轻松创建语义化模板,Mustache模板和Handlebars是兼容的,所以你可以将Mustache导入Handlebars以使用 Ha ...
- Javascript模板引擎mustache.js详解
mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后只有9KB,非常值得在项目中使用.本文总结它的使用方法和一些使用心得,内容不算很高深 ...
- Mustache.js前端模板引擎源码解读
mustache是一个很轻的前端模板引擎,因为之前接手的项目用了这个模板引擎,自己就也继续用了一会觉得还不错,最近项目相对没那么忙,于是就抽了点时间看了一下这个的源码.源码很少,也就只有六百多行,所以 ...
随机推荐
- 【BZOJ】【2120】数颜色 & 【2453】维护队列
莫队算法 分块大法吼 这题乍一看跟HH的项链很像啊……只是多了一个修改操作……然而我就不会做了
- OTL翻译(8) -- otl_long_string/otl_long_unicode_string类
otl_long_string/olt_long_unicode_string 这两个类主要用来处理大对象数据.从OTL4.0版本开始,otl_long_string还可以处理任何类型的RAW/BIA ...
- after the first ten days
This is the first week for me to speak English formally. There’re two main problems: First, I’m scar ...
- DotNetBar中dotNetBarManager设置窗口 实现单文档视图界面
本人想设计一个但文档视图的界面: |--------------------------------------------------------------- | Ribbon Bar |-- ...
- 模态框在IE下的问题,即position:fixed在IE下不兼容的处理方式
项目中遇到的问题,模态框在IE下总出现如图所示双层遮罩框,经排查发现是由于bootstrap里写的modal的样式里position:fixed不兼容IE的原因,导致铺不满整个窗口. 解决方案:在项目 ...
- win7+iis7+asp+.net+php环境配置
一.我们先来配置一下iis: f 1. 点击[開始]->[控制面板]->点击[程序和功能]进入下一步 2. 然后,在左側点击[打开或关闭Windows功能].然后会跳出来一个框 3. 開始 ...
- AndroidManifest 中android:exported
假设Service等的AndroidManifest中声明为android:exported="false" 则该服务不可以跨进程使用. Permission De ...
- 【MySQL】MySQL-主从复制-集群方案-数据一致性问题解决方案 && MySQL备份的各种姿势
1.写性能如何保证:分库分表 2.读性能如何保证:主从结构,实时备份 3.一致性问题怎么解决: 3.1.微博案例:Redis缓存,热数据查询走Redis,主从的延迟通过Redis消除 3.2.支付宝的 ...
- 软件project(一)——宏观总结
曾经看视频,看过去就忘.不想再这样子下去了,所以总结了好久.想让自己忘不了.这个过程花费时间有点长,可是假设让自己忘不了.一切都值了. 以下先来一张导图来总结一下<软件project>这门 ...
- 高并发分布式环境中获取全局唯一ID[分布式数据库全局唯一主键生成]
需求说明 在过去单机系统中,生成唯一ID比较简单,可以使用MySQL的自增主键或者Oracle中的sequence, 在现在的大型高并发分布式系统中,以上策略就会有问题了,因为不同的数据库会部署到不同 ...