swift 之 mustache模板引擎
用法:
Variable Tags
{{name}}
用来渲染值namedatas: let data = ["value": "test"] -----------
template: {{value}} a lession -----------
rendering: test a lession
Section Tags
{{#items}}...{{/items}}
执行条件语句,枚举出里面的对象- 按需渲染数据
- 遍历数据
- 获取里面的每一项
如果
{{value}}...{{/value}}
中的value错误的(下面的),那么将不会被渲染:
1. 缺少值
2. false
3. 0
4. 字符串
5. 空集合
6. 为NSNull如果value 是集合的话
datas:
[
"friends": [
[ "name": "Hulk Hogan" ],
[ "name": "Albert Einstein" ],
[ "name": "Tom Selleck" ],
]
] ------------- template:
{{# friends }}
- {{ name }}
{{/ friends }} -------------
rendering: - Hulk Hogan
- Albert Einstein
- Tom Selleck
上面所说的集合可以是Arrays,ranges, sets, NSArray, NSSet等
其他值既不是falsey, 也不是collection,那么这个块就会被渲染一次:
datas:
[
"user": [
"name": "Mario"
"score": 1500
]
] -------------
template:
{{# user }}
- {{ name }}
- {{ score }}
{{/ user }} --------------
rendering:
- Mario
- 1500
{{^items}}...{{/items}}
对应于上方的对立面data:
[
"persons": []
] --------------
template:
{{# persons }}
- {{name}} is {{#alive}}alive{{/alive}}{{^alive}}dead{{/alive}}.
{{/ persons }}
{{^ persons }}
Nobody
{{/ persons }} -------------
rendering:
Nobody --------------
data:
[
"persons": [
["name": "Errol Flynn", "alive": false],
["name": "Sacha Baron Cohen", "alive": true]
]
]
---------------
rendering:
- Errol Flynn is dead.
- Sacha Baron Cohen is alive.
Partial Tags
{{>partial}}
, 嵌入其他模块douc.mustanche
Guests:
{{# guests }}
{{> person }}
{{/ guests }} --------------
person.mustache
{{ name }} -------------
data:
[
"guests": [
["name": "Frank Zappa"],
["name": "Lionel Richie"]
]
] --------------
rendering:
Guests:
- Frank Zappa
- Lionel Richie
Partial Override Tags
{{<layout}}...{{/layout}}
, 模板继承layout.mustache // title , 和content 可以被覆盖
<html>
<head>
<title>{{$ title }}Default title{{/ title }}</title>
</head>
<body>
<h1>{{$ title }}Default title{{/ title }}</h1>
{{$ content }}
Default content
{{/ content }}}
</body>
</html> ---------------
article.mustuche: {{< layout }} {{$ title }}{{ article.title }}{{/ title }} {{$ content }}
{{{ article.html_body }}}
<p>by {{ article.author }}</p>
{{/ content }} {{/ layout }} ---------------
data: [
"article": [
"title": "The 10 most amazing handlebars",
"html_body": "<p>...</p>",
"author": "John Doe"
]
] ----------------
rendering: <html>
<head>
<title>The 10 most amazing handlebars</title>
</head>
<body>
<h1>The 10 most amazing handlebars</h1>
<p>...</p>
<p>by John Doe</p>
</body>
</html>
{{$ title }}...{{/ title }}
每次都会被渲染,并且只被渲染一次, no boolean checks, no collection iteration.一个模板可以包含很多partial override tags
避免循环
Set Delimiters Tags
{{=<% %>=}}
, 让你改变标签分隔符。
Comment Tags
{{! Wow. Such comment. }}
, 注释
paragma Tags
{{% CONTENT_TYPE:TEXT }}
{{% CONTENT_TYPE:HTML }}
swift 之 mustache模板引擎的更多相关文章
- JS模板引擎-Mustache模板引擎使用实例1-表格树
1 使用实例代码 1.jsp代码 <!DOCTYPE html> <html lang="zh-CN"> <head> <title> ...
- Mustache模板引擎
Mustache是一个Logic-Less模板引擎,即:零逻辑引擎,原因在于它只有标签,没有流程控制语句,这是它与其它模板引擎不同的地方. Mustache小巧玲珑,几乎用各种语言都实现了一遍. Mu ...
- nodejs+Express中使用mustache模板引擎
由于公司一个seo项目,需要我协助.此项目他人已经开发大半,由于seo需要,使用了服务器端模板引擎.我项目的后端同事说项目是go语音写的,跑项目麻烦,只给了我template和css等静态文件. 为了 ...
- 前端数据渲染及mustache模板引擎的简单实现
早期数据渲染的几种方式 在模板引擎没有诞生之前,为了用JS把数据渲染到页面上,诞生了一系列数据渲染的方式. 最最基础的,莫过于直接使用DOM接口创建所有节点. <div id="roo ...
- 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是一个很轻的前端模板引擎,因为之前接手的项目用了这个模板引擎,自己就也继续用了一会觉得还不错,最近项目相对没那么忙,于是就抽了点时间看了一下这个的源码.源码很少,也就只有六百多行,所以 ...
随机推荐
- 纳税服务系统【异常处理、抽取BaseAction】
前言 本博文主要讲解在项目中异常是怎么处理的.一般我们都不会直接把后台异常信息返回给用户,用户是看不懂的.让用户看见一大串的错误代码,这是不合理的.因此我们需要对报错进行处理. 我们在开发的时候是使用 ...
- 转 Java输入输出流详解(非常详尽)
转 http://blog.csdn.net/zsw12013/article/details/6534619 通过数据流.序列化和文件系统提供系统输入和输出. Java把这些不同来源和目标的数据都 ...
- XML-为XML添加DTD-Schema方法
以后都按照如下方式为XML添加dtd或者schema 1,一般从源码jar包里找dtd文件,拷贝到自己的本地目录中: 比如mybatis在如下目录中有dtd :~/ mybatis-3.2.2-sou ...
- python import xxx 与 from xxx import xx 模块引入的区别
有如下脚本script1.py: A='aaaa'B='bbbb'C='cccc'print A,B,C 1.命令行交互模式下使用import 导入方式1: >>>import sc ...
- JavaScript中的位置屬性
屏幕中的位置(直接使用,無需前綴): screenLeft.screenTop:除了火狐都支持 screenX.screenY: 窗口的大小(谷歌的inner=outer,直接使用,無需前綴): in ...
- Azure Powershell使用已有Image创建ARM非托管磁盘虚拟机
生成Image映像文件,记录好Image的URL(下面URL为测试URL,具体请参考实际):ImageURL:https://hlmrgstoragen.blob.core.chinacloudapi ...
- Django(博客系统):按照时间分层筛选“/blog/article/?create_time__year=2017”,出现问题:Database returned an invalid datetime value. Are time zone definitions for your database installed?
问题背景 添加文章时间没问题,但为了设定博客文章按照时间分层筛选(创建时间的年份.年月&月份来搜索文章),我在blog这个django app的admin.py的ArticleAdmin类中做 ...
- 关于Vue问题记录
第一次安装Vue时,npm run dev报错处理 1.如果是报错:提示说没找到test这个文件夹 参考资料:https://segmentfault.com/q/1010000010893904 就 ...
- Java子线程中的异常处理(通用)
在普通的单线程程序中,捕获异常只需要通过try ... catch ... finally ...代码块就可以了.那么,在并发情况下,比如在父线程中启动了子线程,如何正确捕获子线程中的异常,从而进行相 ...
- http://codeforces.com/contest/828
哇这是我打的第一场cf,第一题都wa了无数次,然后第二题差几分钟交 ,第二天一交就AC了内心是崩溃的.果然我还是太菜l.... A. Restaurant Tables time limit per ...