テンプレートを作成して使用する
<img src="{{Absolute_url(asset('images/logo.png')) }}" alt="Symfony!" />
念のため言っておきますが、 Controller (コントローラー) は、symfony プログラムに入るすべてのリクエストを処理する責任があります。実際、コントローラーはコードをテストして再利用できるように、面倒な作業のほとんどを他の場所に委任します。コントローラーが HTML、CSS、またはその他のコンテンツを生成する必要がある場合、その作業をテンプレート エンジンに渡します。この章では、ユーザーにコンテンツを返したり、メールにデータを入力したりするための強力なテンプレートを作成する方法を学びます。また、ショートカット、テンプレートを拡張するための賢い方法、テンプレート コードを再利用する方法についても学びます。
テンプレートのレンダリング方法については、「Framework Start」のコントローラーを参照してください。
テンプレート ¶
テンプレートは、テキスト形式 (html、xml、csv、LaTex...) に基づいて任意のテキスト ファイルを生成します。私たちが最もよく知っているテンプレートのタイプは、php テンプレートです。これは、PHP エンジンによって解析されるテキストと PHP コードを含むテキスト ファイルです。 symfony フレームワークのより強力なテンプレート言語。それは Twig と呼ばれます。 Twig を使用すると、簡潔で読みやすく、デザイナーにとって使いやすいテンプレートを作成できます。これは、いくつかの点で PHP テンプレートよりもはるかに強力です。
<!DOCTYPE html> <html> <head> <title>Welcome to Symfony!</title> </head> <body> <h1><?php echo $page_title ?></h1> <ul id="navigation"> <?php foreach ($navigation as $item); ?> <li> <a href="<?php echo $item->getHref(); ?>"> <?php echo $item->getCaption(); ?> </a> </li> <?php endforeach; ?> </ul> </body> </html>
Twig は 3 つの特別な構文を定義します:
- {{ ... }}
「何か言ってください」 ": 変数の値または式の結果をテンプレートに出力します。{% ... %}「何をすべきか」: *タグ (タグ)* テンプレート ロジックを制御し、for などのステートメントを実行するために使用されます。ループステートメントなど{# ... #}「コメント」: PHP の/* comment */- 構文に相当します。単一行および複数行のコメントに使用されます。コメントの内容はページとして出力されません。
も含まれています。次の例では、レンダリング前に title 変数をすべて大文字にします。 <!DOCTYPE html>
<html>
<head>
<title>Welcome to Symfony!</title>
</head>
<body>
<h1>{{ page_title }}</h1>
<ul id="navigation"> {% for item in navigation %}
<li><a href="{{ item.href }}">{{ item.caption }}</a></li> {% endfor %}
</ul>
</body>
</html>Twig には、デフォルトで使用できる多数の組み込みタグと変数フィルターがあります。 Twig 拡張機能を利用して、独自の
レギュレータや関数 (その他) を追加することもできます。
でタグ付けするだけです。
Twig コードは PHP コードに非常に似ていますが、両者の間には微妙な違いがあります。次の例では、標準の for タグと cycle 関数を使用して 10 個の div タグを出力し、odd、even の CSS クラスを交互に使用します。 。
{{ title|upper }}この章のテンプレート ルーチンは、twig と php の両方を使用して表示されます。
Twig を使用しない場合、または無効にしている場合は、kernel.execption イベントを使用して独自の例外処理を実装する必要があります。
Twig テンプレートのキャッシュ ¶
Twig は高速で、各 Twig テンプレートはネイティブ PHP クラスにコンパイルされ、キャッシュされます。コンパイルされたクラスは、var/cache/{environment}/twig ディレクトリに保存されます ({environment} は、dev や などの環境です) prod)、場合によっては同時にデバッグできるため、非常に便利です。環境の詳細については、次を参照してください: Environment
debug モードが利用可能な場合 (devEnvironment)、twig テンプレートが変更された場合、自動的に再コンパイルされます。つまり、キャッシュのクリアを気にせずにテンプレートを変更できるということです。
debug モードがオフになっている場合 (prod 環境)、Twig テンプレートを再生成するには、Twig キャッシュ ディレクトリを手動でクリアする必要があります。プログラムをデプロイするときにこれを忘れずに行ってください。
テンプレートの継承とレイアウト ¶
ほとんどの場合、テンプレートにはヘッダー、フッター、サイドバーなどのプロジェクト内の共通要素が含まれます。 Symfony では、この問題に別の観点からアプローチします。テンプレートは他のテンプレートで装飾できます。これは PHP クラスと同様に機能します。テンプレートの継承により、サイトのすべての共通要素を含む基本「レイアウト」テンプレートを作成でき、blocks (「基本メソッドを含む」PHP 基本クラスのように) として定義されます。 ")。子テンプレートは、レイアウトの基本テンプレートを継承し、そのブロックのいずれかをオーバーライドできます (「PHP サブクラスが親クラスの特定のメソッドをオーバーライドする」のと同様)。
最初にレイアウト基本ファイルを作成します:
<ul>
{% for user in users if user.active %}
<li>{{ user.username }}</li> {% else %}
<li>No users found</li> {% endfor %}</ul>Twig：{# app/Resources/views/base.html.twig #}<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{% block title %}Test Application{% endblock %}</title>
</head>
<body>
<div id="sidebar"> {% block sidebar %}
<ul>
<li><a href="/">Home</a></li>
<li><a href="/blog">Blog</a></li>
</ul> {% endblock %}
</div>
<div id="content"> {% block body %}{% endblock %}
</div>
</body>
</html>Twig テンプレートの継承についての説明ですが、twig テンプレートと php テンプレートの考え方は同じです。
このテンプレートは、単純な 2 列の HTML ページを定義します。この例では、3 つの {% block %} 領域 (つまり、title、sidebar、body) が定義されています。各ブロックは、それを継承するサブテンプレートによってオーバーライドすることも、現在のデフォルト実装を保持することもできます。テンプレートを直接レンダリング (出力) することもできます。ただし、この時点では基本テンプレートで定義された内容のみが表示され、title、sidebar、body はデフォルト値のままとなります。
子テンプレートは次のようになります:
PHP:<!-- app/Resources/views/base.html.php -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><?php $view['slots']->output('title', 'Test Application') ?></title>
</head>
<body>
<div id="sidebar"> <?php if ($view['slots']->has('sidebar')): ?>
<?php $view['slots']->output('sidebar') ?>
<?php else: ?>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/blog">Blog</a></li>
</ul> <?php endif ?>
</div>
<div id="content"> <?php $view['slots']->output('body') ?>
</div>
</body>
</html>Twig：{# app/Resources/views/blog/index.html.twig #}{% extends 'base.html.twig' %} {% block title %}My cool blog posts{% endblock %} {% block body %}
{% for entry in blog_entries %}
<h2>{{ entry.title }}</h2>
<p>{{ entry.body }}</p> {% endfor %}{% endblock %}親テンプレートは特別な文字列 syntaxbase.html.twig で表され、このパスはは、プロジェクト全体の app/Resources/views ディレクトリに対する相対パスです。同じ論理名で ::base.html.twig を使用することもできます。以下の テンプレート名と場所を参照してください。
テンプレート継承のキーワードは、{% extends %} タグです。このタグは、レイアウトを設定し、いくつかのブロックを定義する親テンプレートを最初に評価するようにテンプレート エンジンに指示します。次に、子テンプレートがレンダリングされ、上記の例の親テンプレートで定義されている 2 つのブロック title と body は、子テンプレートの同じ名前のブロック コンテンツに置き換えられます。 。 blog_entries の値に応じて、出力コンテンツは次のようになります。
php：<!-- app/Resources/views/blog/index.html.php --><?php $view->extend('base.html.php') ?> <?php $view['slots']->set('title', 'My cool blog posts') ?> <?php $view['slots']->start('body') ?>
<?php foreach ($blog_entries as $entry): ?>
<h2><?php echo $entry->getTitle() ?></h2>
<p><?php echo $entry->getBody() ?></p> <?php endforeach ?><?php $view['slots']->stop() ?> sidebar ブロックは子テンプレートで定義されていないため、コンテンツは次のようになります。親テンプレートのものが表示されます。親テンプレートの {% block %} タグ内のコンテンツは、常にデフォルト値として使用されます。
テンプレートの継承は、任意のレベルで実行できます。 Symfony プロジェクトは通常、「3 レベルの継承」モデルを使用してテンプレートとページを整理します。継承を使用して Twig テンプレートを整理する方法を参照してください。
テンプレート継承を使用する場合は、次の点に注意してください:
テンプレートで
{% extends %}を使用する場合、それはテンプレートの最初のタグである必要があります。ベース (レイアウト) テンプレート内の
{% block %}タグが多ければ多いほど良いです。子テンプレートですべてのブロックを定義する必要はないことに注意してください。親テンプレート 。基本テンプレートで定義されるブロックが増えるほど、レイアウトの柔軟性が高まります。複数のテンプレートで重複したコンテンツが見つかった場合は、親テンプレート # でそのコンテンツに対して
{% ブロック %}## を定義する必要がある可能性があります。場合によっては、コンテンツを新しいテンプレートに配置し、そのテンプレート内にincludeする方が良い解決策となる場合があります。 (以下を参照: 他のテンプレートを含む)- 親テンプレートからブロックのコンテンツを取得する必要がある場合は、
{{parent() }}# ＃＃ 関数 。これは、親ブロックを完全に上書きするのではなく、親ブロックの上に新しいコンテンツを追加するだけの場合に便利です:
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>My cool blog posts</title> </head> <body> <div id="sidebar"> <ul> <li><a href="/">Home</a></li> <li><a href="/blog">Blog</a></li> </ul> </div> <div id="content"> <h2>My first post</h2> <p>The body of the first post.</p> <h2>Another post</h2> <p>The body of the second post.</p> </div> </body></html>
テンプレートの名前と保存場所 ¶
Default この場合、テンプレートは 2 つの異なる場所に保存できます:
{% block sidebar %}
<h3>Table of Contents</h3>
{# ... #} {{ parent() }}{% endblock %}プログラム レベルのビュー ディレクトリには、プログラム全体の基本テンプレート (プログラム レイアウトとバンドル テンプレート) だけでなく、「サードパーティ バンドルをオーバーライドするために使用されます」「テンプレート」テンプレート (サードパーティ バンドルのテンプレートをオーバーライドする方法)。
app/Resources/views
各サードパーティ バンドルのテンプレートは、独自の
Resources/views/ ディレクトリ (またはサブディレクトリ) に保存されます。バンドルを共有する場合は、app/ ディレクトリではなく、バンドルに配置する必要があります。 多くの場合、使用するテンプレートは
ディレクトリにあります。必要なテンプレート パスは、このディレクトリからの相対パスです。たとえば、app/Resources/views/base.html.twig をレンダリング/継承するには、base.html.twig のパスを使用する必要がありますが、 をレンダリングするにはapp/Resources/views/blog/index.html.twig の場合は、blog/index.html.twig パスを使用する必要があります。 バンドルへのテンプレートの導入
Symfony は、テンプレートを表すために
bundle:directory:filename 文字列構文を使用します。これは、さまざまな種類のテンプレートを表すことができ、それぞれが特定のパスに保存されます。
- AcmeBlogBundle:Blog:index.html.twig
- は、特定のページ テンプレートを指定するために使用されます。文字列は 3 つの部分に分かれており、各部分はコロン (
:) で区切られており、次の意味を持ちます:
- AcmeBlogBundle
: (
bundle) テンプレートは、src/Acme/BlogBundle などの AcmeBlogBundle にあります; - Blog
: (
Directory) は、テンプレートが Resources/views のBlogサブディレクトリにあることを示します; ##index.html.twig - : (
ファイル名
AcmeBlogBundle が) ファイルの実際の名前はindex.html.twig です。 src/Acme/BlogBundle
src/Acme/BlogBundle/Resources/views/ になります。ブログ/index.html.twig
AcmeBlogBundle::layout.html.twigこの構文は、AcmeBlogBundle の親テンプレートを指します。中間の「ディレクトリ」部分 (blogなど) がなければ、テンプレートは AcmeBlogBundle のResources/views/layout.html.twigに配置される必要があります。はい、中央の 2 つのコロンは、「controller」サブディレクトリ部分が無視されることを意味します。
記事「サードパーティ バンドルのテンプレートを上書きする方法」では、AcmeBlogBundle にあるテンプレートが app/Resources/AcmeBlogBundle/views/ ディレクトリにある方法について説明します。同じ名前のテンプレートによってオーバーライドされるこのメソッドは、バンドル作成者が提供するバンドル テンプレートをオーバーライドする強力な方法を提供します。
テンプレートの命名構文は見覚えがあるかもしれません。これは、「コントローラーの命名パターン」で説明されている規則に似ています。
テンプレート サフィックス ¶
各テンプレートには 2 つの拡張子があり、 形式 (フォーマット) とテンプレート エンジン (エンジン) を指定するために使用されます。 。
| 形式 | エンジン | |
|---|---|---|
blog/index.html.twig | HTMLTwig | |
blog/index.html.php | HTMLPHP | |
blog/index.css 。小枝 | CSS小枝 |
