为模版设计师而生的Twig(上)-Twig使用指南
原文地址:http://my.oschina.net/veekit/blog/268828
1. 概要
模板是一个简单的文本文件。它可以生成任何基于文本的格式(HTML、XML、CSV等)。它不具有特定扩展名,html或xml都OK。 模板中包含的变量或表达式,用来控制模板的逻辑。当模版被预处理时,它们会被替换为变量值。
下面是说明了一些基本要素的最小模板。稍后我们将介绍更多细节:
<!DOCTYPE html>
<html>
<head>
<title>My Webpage</title>
</head>
<body>
<ul id="navigation">
{% for item in navigation %}
<li><a href="{{ item.href }}">{{ item.caption }}</a></li>
{% endfor %}
</ul>
<h1>My Webpage</h1>
{{ a_variable }}
</body>
</html>
Twig有两种类型的分隔符:{%...%} 和 {{...}} 。第一个是用于执行诸如for循环的控制语句,后者则在模板中打印一个表达式的结果。
2. IDEs 集成
许多IDE支持Twig语法高亮和自动完成标签:
※ TextMate 通过 Twig Bundle
※ Vim 通过 Jinja syntax 插件 或 vim-twig 插件
※ NetBeans 通过 Twig syntax 插件(7.2+)
※ PhpStorm(原生2.1+)
※ Eclipse 通过 Twig plugin
※ Sublime 通过 Twig bundle
※ GtkSourceView 通过 Twig language definition
※ Coda and SubEthaEdit 通过 Twig syntax mode
※ Coda 2 通过 other Twig syntax mode
※ Komodo and Komodo Edit 通过 Twig highlight/syntax check mode
※ Notepad++ 通过 Notepad++ Twig Highlighter
※ Emacs 通过 web-mode.el
3. 变量
应用程序将变量传递到操作的模板中。你也可以访问变量的属性或元素。一个变量的可视化表示在很大程度上依赖于应用程序提供的值。你可以使用点(.)或所谓的下标语法([])来访问变量的属性(PHP对象的方法或属性,PHP数组的元素)。
{{ foo.bar }}
{{ foo['bar'] }}
当属性中包含特殊字符(如 - 这会被解释为减号操作符),使用attribute()函数来替代使用点(.)访问变量属性:
{# equivalent to the non-working foo.data-foo #}
{{ attribute(foo, 'data-foo') }}
重要提示:要知道,大括号不是变量的一部分,print语句除外。当访问标签内的变量,不要把大括号加在变量上。
如果一个变量或属性不存在,strict_variables选项设置为false时,您将收到一个空值;另外,如果strict_variables设置为true,Twig将会抛出一个错误(参照见 environment options)
变量调用机制
为了方便起见,在PHP表现层调用foo.bar时,会进行以下操作:
a.1 检查foo是否是个数组,并检查bar是否是有效的元素 a.2 如果不是,foo是个对象,并检查bar是否是有效的属性 a.3 如果不是,foo是个对象,并检查bar是否是有效方法。(即使bar是一个构造器。那么请使用__construct()方法替代 a.4 如果不是,foo是个对象,会检查getBar()是否是有效的方法 a.5 如果不是,foo是个对象,会检查isBar()是否是有效的方法 a.6 如果不是,返回空值(null) a.7 检查foo是一个数组和bar是一个有效的元素; a.8 如果没有,则返回null值。
4. 全局变量
下面的变量在模板中总是可用:
_self: 引用当前模版;
_context: 引用当前的上下文;
_charset: 引用当前的字符集。
5. 设置变量
您可以将值赋给内部代码块中的变量。赋值使用 set 标签:
{% set foo = 'foo' %}
{% set foo = [1, 2] %}
{% set foo = {'foo': 'bar'} %}
6. 过滤器
变量可以通过过滤器进行修改。过滤器和变量之间使用管道符号(也就是竖线 | )分隔开,过滤器括号中可能有可选的参数。多个过滤器可以串连使用,滤波器的输出会被应用于下一个过滤器。
下面的示例是从名称中删除所有的HTML标签并应用title-cases格式化:
{{ name|striptags|title }}
过滤器接受括号中的参数。 这个例子将用逗号连接一个列表:
{{ list|join(', ') }}
要对一段代码应用过滤器,只要使用 filter 标签把它包起来:
{% filter upper %}
This text becomes uppercase
{% endfilter %}
访问 Filters 页面,以了解更多关于内置过滤器。
7. 函数
函数可以被调用来生成内容。函数是通过它们的[函数名+()]进行调用的,可能还带有参数。
例如,range()函数返回一个包含一个整数等差数列的列表:
{% for i in range(0, 3) %}
{{ i }},
{% endfor %}
访问 Functions 页面,以了解更多关于内置函数。
8. 命名参数
1.12版本新特性:对命名参数的支持被添加到Twig 1.12版。
{% for i in range(low=1, high=10, step=2) %}
{{ i }},
{% endfor %}
使用命名参数,让你的模板更明确的了解,您作为参数传递的值的含义:
{{ data|convert_encoding('UTF-8', 'iso-2022-jp') }}
{# versus (对比) #}
{{ data|convert_encoding(from='iso-2022-jp', to='UTF-8') }}
命名参数还允许您跳过一些你不希望更改默认值的参数:
{# the first argument is the date format, which defaults to the global date format if null is passed #}
{{ "now"|date(null, "Europe/Paris") }}
{# or skip the format value by using a named argument for the time zone #}
{{ "now"|date(timezone="Europe/Paris") }}
您也可以在一个调用中使用占位参数和命名参数,在这种情况下,占位参数必须在命名参数之前:
{{ "now"|date('d/m/Y H:i', timezone="Europe/Paris") }}
提示:每个函数和过滤器的文档页面,都有一段内容,列出它们支持的所有参数名称。
9. 控制结构
控制结构指的是所有这些控制程序流程的代码:条件语句(如:if/elseif/else)、for循环以及类似的代码块。控制结构出现在{%...%}块内。
例如,要显示一个由变量(users)提供的用户列表,使用 for 标签:
<h1>Members</h1>
<ul>
{% for user in users %}
<li>{{ user.username|e }}</li>
{% endfor %}
</ul>
if 标签可以用于测试表达式:
{% if users|length > 0 %}
<ul>
{% for user in users %}
<li>{{ user.username|e }}</li>
{% endfor %}
</ul>
{% endif %}
访问 tags 页面,以了解更多关于内置标签。
10. 注释
要在模板中注释掉一部分,使用注释语法{#...#}。这对于调试或添加信息给其他模板设计者或自己看会很有用:
{# note: disabled template because we no longer use this
{% for user in users %}
...
{% endfor %}
#}
11. 包含其他模板
包含一个模板时,include标签很有用,它会返回该模板(子模版)的内容呈现到当前模版(父模版):
{% include 'sidebar.html' %}
默认情况下每个被包含的模板都会传递当前上下文(context)。传递给父模板的上下文,还包括在子模板中定义的变量:
{% for box in boxes %}
{% include "render_box.html" %}
{% endfor %}
被包含的模板 render_box.html 能够访问变量 box。
模板的文件名取决于模板加载器。例如,Twig_Loader_Filesystem 允许你通过给文件名来访问其他模板。您可以访问以斜线分隔的子目录中的模板:
{% include "sections/articles/sidebar.html" %}
此行为取决于应用程序中嵌入Twig。
为模版设计师而生的Twig(上)-Twig使用指南的更多相关文章
- 为模版设计师而生的Twig(下)-Twig使用指南
原文地址:http://my.oschina.net/veekit/blog/276800 12. 模板继承 Twig最强大的部分是模板继承.模板继承允许你建立一个基本的"骨架"模 ...
- C#在Linux上的开发指南
本人才疏学浅,在此记录自己用C#在Linux上开发的一点经验,写下这篇指南.(给想要在Linux上开发C#程序的朋友提供建议) 目前在Linux上跑的网站:http://douxiubar.com | ...
- iOS9新系统下APP Store 应用上传新指南
一 iTunes Connect介绍 iTunes Connect是面向iOS应用开发人员的苹果门户网站,供开发人员管理其应用,跟踪下载情况.今年1月份闹得沸沸扬扬的iTunes Connect BU ...
- JVM(一)史上最佳入门指南
提到Java虚拟机(JVM),可能大部分人的第一印象是"难",但当让我们真正走入"JVM世界"的时候,会发现其实问题并不像我们想象中的那么复杂.唯一真正令我们恐 ...
- SWFUpload多文件上传使用指南
SWFUpload是一个flash和js相结合而成的文件上传插件,其功能非常强大.以前在项目中用过几次,但它的配置参数太多了,用过后就忘记怎么用了,到以后要用时又得到官网上看它的文档,真是太烦了.所以 ...
- JVM史上最佳入门指南
提到Java虚拟机(JVM),可能大部分人的第一印象是“难”,但当让我们真正走入“JVM世界”的时候,会发现其实问题并不像我们想象中的那么复杂.唯一真正令我们恐惧的,其实是恐惧本身.而作为整个JVM系 ...
- C#在Linux上的开发指南(续)
续之前的一篇开发指南http://www.cnblogs.com/RainbowInTheSky/p/5496777.html 部分人在部署的时候经常出现dll兼容问题(其实可以看小蝶惊鸿的文章,蝶神 ...
- iOS9新系统下App Store应用上传新指南
http://www.cocoachina.com/appstore/20151010/13691.html 最近频繁收到小伙伴们的反馈,说经过前期学习已对ASO规则略有了解,但APP的提交审核是由技 ...
- Jquery FormData文件异步上传 快速指南
网站中文件的异步上传是个比较麻烦的问题,不过现在通过jquery 可以很容易的解决这个问题: 使用jquery2.1版本,较老版本不支持异步文件上传功能: 表单代码: <form id=&quo ...
随机推荐
- web兼容行探究1:IE 6 select节点显示在绝对布局之上的解决方法
解决方式就是在绝对布局的元素下放置一个一样大小的iframe元素,这样iframe可以将select盖住,同时解决了问题. 源码如下: <!-- IE6BUG select在絕對定位的元素之上顯 ...
- Spring中的IOC\DI\AOP等概念的简单学习
IoC(Inversion of Control,控制反转).这是spring的核心,贯穿始终, 所谓IoC,对于spring框架来说,就是由spring来负责控制对象的生命周期和对象间的关系.Spr ...
- PKU 1006
数学问题吧,有兴趣的可以研究一下“中国剩余定理” // 1006.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include < ...
- 实现Launcher默认壁纸、选择壁纸定制化功能
需求功能说明: 该定制需求为在系统中增加一个新的分区如myimage,用以实现存放定制资源.例如在myimage下新建wallpaper文件夹用于存放定制的墙纸图片资源,当Launcher加载 ...
- 【Learning Python】【第二章】Python基础类型和基础操作
基础类型: 整型: py 3.0解决了整数溢出的问题,意味着整型不必考虑32位,64位,有无符号等问题,你写一个1亿亿亿,就是1亿亿亿,不会溢出 a = 10 ** 240 print(a) 执行以上 ...
- UVA 1151二进制枚举子集 + 最小生成树
题意:平面上有n个点(1<=N<=1000),你的任务是让所有n个点连通,为此, 你可以新建一些边,费用等于两个端点的欧几里得距离的平方.另外还有q(0<=q<=8)个套餐(数 ...
- POJ1385 计算多边形的重心
point gravity_center(point* p,int n) { double area=0.0; point ZERO; ZERO.x = 0; ZERO.y = ...
- Protobuf C#教程 ThriftC#教程大合辑
android与PC,C#与Java 利用protobuf 进行无障碍通讯[Socket] http://www.cnblogs.com/TerryBlog/archive/2011/04/23/20 ...
- gdb调试方法
先打开 gdb 的调试选项: -g 串口端: ./gdb-server 10.12.2.100:12345 ./Kylin 服务器端: (1)./gdb ./Kylin (2) targ ...
- sublime Text3 编写java
安装好jdk,并且配置好环境变量后(也可以放到sublime 中去配置) 2.一般的sublimetext 已经有了javac的buildsystem, 不过默认的配置不尽人意. 下面进行修改. 在S ...