ヒントとコツ

ドキュメントのこの部分は、Jinjaテンプレートのヒントとコツを示しています。

Null-デフォルトのフォールバック

Jinjaは動的継承をサポートし、 extends タグにアクセスしない限り、親テンプレートと子テンプレートを区別しません。これは、空白を含む最初の extends タグの前のすべてが無視されるのではなく出力されるという驚くべき動作につながりますが、巧妙なトリックに使用できます。

通常、子テンプレートは、基本的なHTMLスケルトンを追加する1つのテンプレートから拡張されます。ただし、 extends タグを if タグに入れて、スタンドアロン変数がfalseと評価された場合にのみ、レイアウトテンプレートから拡張することは可能です。定義されていません。さらに、非常に基本的なスケルトンがファイルに追加されるため、スタンドアロンを True に設定して実際にレンダリングすると、非常に基本的なHTMLスケルトンが追加されます。

{% if not standalone %}{% extends 'default.html' %}{% endif -%}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<title>{% block title %}The Page Title{% endblock %}</title>
<link rel="stylesheet" href="style.css" type="text/css">
{% block body %}
  <p>This is the page body.</p>
{% endblock %}

交互の行

テーブルまたはリストの行ごとに異なるスタイルが必要な場合は、 loop オブジェクトで cycle メソッドを使用できます。

<ul>
{% for row in rows %}
  <li class="{{ loop.cycle('odd', 'even') }}">{{ row }}</li>
{% endfor %}
</ul>

サイクルは無制限の数の文字列を取ることができます。このタグが検出されるたびに、リストの次のアイテムがレンダリングされます。

アクティブなメニュー項目の強調表示

多くの場合、アクティブなナビゲーションアイテムを備えたナビゲーションバーが必要です。これは本当に簡単に実現できます。子テンプレートのブロックの外側の割り当てはグローバルであり、レイアウトテンプレートが評価される前に実行されるため、子テンプレートでアクティブなメニュー項目を定義できます。

{% extends "layout.html" %}
{% set active_page = "index" %}

その後、レイアウトテンプレートは active_page にアクセスできます。さらに、その変数のデフォルトを定義することは理にかなっています。

{% set navigation_bar = [
    ('/', 'index', 'Index'),
    ('/downloads/', 'downloads', 'Downloads'),
    ('/about/', 'about', 'About')
] -%}
{% set active_page = active_page|default('index') -%}
...
<ul id="navigation">
{% for href, id, caption in navigation_bar %}
  <li{% if id == active_page %} class="active"{% endif
  %}><a href="{{ href|e }}">{{ caption|e }}</a></li>
{% endfor %}
</ul>
...

親ループへのアクセス

特別な loop 変数は、常に最も内側のループを指します。外側のループにアクセスしたい場合は、次のようにエイリアスを作成できます。

<table>
{% for row in table %}
  <tr>
  {% set rowloop = loop %}
  {% for cell in row %}
    <td id="cell-{{ rowloop.index }}-{{ loop.index }}">{{ cell }}</td>
  {% endfor %}
  </tr>
{% endfor %}
</table>

ヒントとコツ—Jinjaドキュメント

ヒントとコツ

Null-デフォルトのフォールバック

交互の行

アクティブなメニュー項目の強調表示

親ループへのアクセス

目次