6.4. Twig —— Drupal 的新模板引擎

如果你打开 Stable 主题的 page.html.twig 模板文件：

/core/themes/stable/templates/layout/page.html.twig

你会发现它与 Drupal 7 的 page.tpl.php 模板不同，首先是文件扩展名不同，其次是大量使用花括号 {}。这都是因为 Drupal 使用了 Twig 模板引擎。

<main role="main">
    <a id="main-content" tabindex="-1"></a>{# 链接位于 html.html.twig 中 #}
 
    <div class="layout-content">
      {{ page.content }}
    </div>{# /.layout-content #}
 
    {% if page.sidebar_first %}
      <aside class="layout-sidebar-first" role="complementary">
        {{ page.sidebar_first }}
      </aside>
    {% endif %}
 
    {% if page.sidebar_second %}
      <aside class="layout-sidebar-second" role="complementary">
        {{ page.sidebar_second }}
      </aside>
    {% endif %}
 
  </main>

Twig 模板中不能使用 PHP，因此你只能使用 Twig 提供的工具——不过这些工具足够用于对网站进行样式化。

让我们来了解如何使用 Twig。

Twig 中的变量

在 PHP 中我们使用美元符号 $ 表示变量，而在 Twig 中我们使用花括号：

{{variable}}

因此，我们写变量时，使用两个左花括号、空格、变量名、空格、两个右花括号。要输出一个变量，无需在变量前添加 print 函数，因为 Twig 模板中完全不使用 PHP；只需要将变量放在双花括号中即可。

Twig 对变量对象和数组的处理也很方便。如果在 PHP 中你需要知道 $node 是一个对象，$form 是一个数组，那么在 Twig 中更简单，我们通过点号访问变量属性：

{{node.id}}

我们还可以轻松创建变量：

{% set foo="bar" %}

Hi, here's my variable: {{ foo }}

注意语法区别：设置变量时使用百分号括号（{% %}），而显示变量时使用双花括号（{{ }}）。

我们还可以指定数组：

{%
  set foo_array = [
    'foo',
    'bar',
  ]
%}

Twig 过滤器（Filters）

虽然 Twig 不是一个完整的编程语言，但它提供了一组数据处理工具，其中最重要的工具之一就是过滤器。过滤器使用竖线符号 | 表示：

{{ variable|filter }}

过滤器允许你更改变量的输出，例如：

{{ node.title | length }} —— 输出字符串长度

{{ node.title | uppercase }} —— 将字符串转换为大写

{{ node.title | lowercase }} —— 将字符串转换为小写

完整的 Twig 过滤器列表可参阅官方文档：http://twig.sensiolabs.org/doc/filters/index.html

Drupal Twig 过滤器

Drupal 还为 Twig 添加了自己的过滤器，例如用于换行的过滤器。如果在以前我们使用 PHP 实现的 t() 函数进行翻译，而现在 Twig 中不能使用 PHP 代码，那么我们需要一个替代工具。

Drupal 中的常用过滤器包括：

• t
• passthrough
• placeholder
• drupal_escape
• safe_json
• without
• clean_class
• clean_id

Twig 模板中的多语言文本

Twig 提供了多语言字符串的支持。要翻译一行文本，可以使用 {% trans %} 标签。注意控制结构的写法——使用百分号 % 与变量区分。

{% trans %} Hello world {% endtrans %}

我们还可以向可翻译字符串中传递变量：

{% trans %} Hello {{ name }} {% endtrans %}

也可以在翻译字符串之前通过过滤器修改变量：

{% set name = name|capitalize %}

{% trans %}
  Hello {{ name }}!
{% endtrans %}

Twig 注释

{# 这里是注释 #}

条件语句（If）

虽然 Twig 没有 PHP 的全部功能，但它也提供了操作数组和变量的基本结构。例如，我们可以在输出变量前判断变量是否存在：

{% if site_slogan %}
  <div class="site-slogan">{{ site_slogan }}</div>
{% endif %}

Twig 循环（Loop）

在模板中经常需要遍历数组并逐项输出。Twig 使用 for 循环（类似 PHP 的 foreach）：

{% for item in items %}
  {{ item.content }}
{% endfor %}

我们还可以像 PHP 的 for 循环那样使用 range：

{% for i in range(0, 3) %}
  {{ i }},
{% endfor %}

我们还可以使用 for else 结构：

<ul>
{% for user in users %}
  <li>{{ user.username|e }}</li>
{% else %}
  <li><em>未找到用户</em></li>
{% endfor %}
</ul>