Symfony-view-engine

提供：Dev Guides
移動先:案内、検索

Symfony-ビューエンジン

ビューレイヤーは、MVCアプリケーションのプレゼンテーションレイヤーです。 プレゼンテーションロジックからアプリケーションロジックを分離します。

コントローラは、HTML、CSS、またはその他のコンテンツを生成する必要がある場合、タスクをテンプレートエンジンに転送します。

テンプレート

テンプレートは基本的に、HTML、XMLなどのテキストベースのドキュメントを生成するために使用されるテキストファイルです。 時間を節約し、エラーを減らすために使用されます。

デフォルトでは、テンプレートは2つの異なる場所に存在できます- 

*app/Resources/views/* -アプリケーションのビューディレクトリには、アプリケーションバンドルのアプリケーションのレイアウトとテンプレートを含めることができます。 また、サードパーティのバンドルテンプレートも上書きします。
*vendor/path/to/Bundle/Resources/views/* -各サードパーティバンドルには、そのテンプレートが「Resources/views/」ディレクトリに含まれています。

小枝エンジン

symfonyは Twig と呼ばれる強力なテンプレート言語を使用します。 Twigを使用すると、簡潔で読みやすいテンプレートを非常に簡単に作成できます。 Twigテンプレートはシンプルで、PHPタグを処理しません。 Twigは、空白制御、サンドボックス、および自動HTMLエスケープを実行します。

構文

Twigには3種類の特別な構文が含まれています-

  • \ {\ {…​ }} -変数または式の結果をテンプレートに出力します。
  • \ {％…​ ％} -テンプレートのロジックを制御するタグ。 主に機能の実行に使用されます。
  • \ {＃…​ ＃} -コメントの構文。 単一行または複数行のコメントを追加するために使用されます。

twigベーステンプレートは*「app/Resources/views/basel.twig」*にあります。

例

小枝エンジンを使用した簡単な例を見てみましょう。

StudentController.php

<?php
namespace AppBundle\Controller;

use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;

class StudentController extends Controller {
  /* *
     * @Route("/student/home")
   */
   public function homeAction() {
      return $this->render('student/homel.twig');
   }
}

ここでは、* render（）*メソッドがテンプレートをレンダリングし、そのコンテンツをResponseオブジェクトに入れます。

次に、「views」ディレクトリに移動して「student」というフォルダを作成し、そのフォルダ内に「homel.twig」というファイルを作成します。 ファイルに次の変更を追加します。

homel.twig

//app/Resources/views/student/homel.twig
<h3>Student application!</h3>

「http：//localhost：8000/student/home」というURLをリクエストすることで結果を取得できます。

デフォルトでは、Twigにはタグ、フィルター、および関数の長いリストが付属しています。 1つずつ詳しく見ていきましょう。

Tags

Twigは次の重要なタグをサポートしています-

Do

*do* タグは、何も出力しないことを除いて、正規表現と同様の機能を実行します。 その構文は次のとおりです-
{% do 5 + 6 %}

含める

includeステートメントにはテンプレートが含まれ、そのファイルのレンダリングされたコンテンツを現在のネームスペースに返します。 その構文は次のとおりです- 

{% include 'templatel' %}

拡張する

extendsタグは、テンプレートを別のテンプレートから拡張するために使用できます。 その構文は次のとおりです- 

{% extends "templatel" %}

ブロック

ブロックはプレースホルダーとして機能し、コンテンツを置き換えます。 ブロック名は、英数字とアンダースコアで構成されます。 例えば、 

<title>{% block title %}{% endblock %}</title>

埋め込む

*embed* タグは、インクルードと拡張の両方の組み合わせを実行します。 別のテンプレートのコンテンツを含めることができます。 また、テンプレートを拡張するときなど、含まれているテンプレート内で定義されたブロックをオーバーライドすることもできます。 その構文は次のとおりです-
{% embed “new_template.twig” %}
   {# These blocks are defined in “new_template.twig" #}
   {% block center %}
      Block content
   {% endblock %}
{% endembed %}

フィルタ

フィルターセクションを使用すると、テンプレートデータのブロックに通常のTwigフィルターを適用できます。 例えば、 

{% filter upper %}
   symfony framework
{% endfilter %}

ここでは、テキストが大文字に変更されます。

For

*For* ループは、シーケンス内の各アイテムを取得します。 例えば、
{% for x in 0..10 %}
   {{ x }}
{% endfor %}

If

Twigの if ステートメントはPHPに似ています。 式はtrueまたはfalseに評価されます。 例えば、 

{% if value == true %}
   <p>Simple If statement</p>
{% endif %}

フィルター

Twigにはフィルターが含まれています。 レンダリングされる前にコンテンツを変更するために使用されます。 以下は、注目に値するフィルターの一部です。

長さ

長さフィルターは、文字列の長さを返します。 その構文は次のとおりです- 

{% if name|length > 5 %}
   ...
{% endif %}

下

下側のフィルターは値を小文字に変換します。 例えば、 

{{ 'SYMFONY'|lower }}

それは次の結果を生成します- 

symfony

同様に、大文字を試すことができます。

交換する

置換フィルターは、プレースホルダーを置換することにより、指定された文字列をフォーマットします。 例えば、 

{{ "tutorials point site %si% and %te%."|replace({'%si%': web, '%te%': "site"}) }}

それは次の結果を生成します- 

tutorials point website

タイトル

タイトルフィルターは、値のタイトルケースバージョンを返します。 例えば、 

{{ 'symfony framework '|title }}

それは次の結果を生成します- 

 Symfony Framework

Sort

並べ替えフィルターは配列を並べ替えます。 その構文は次のとおりです- 

{% for user in names|sort %}
   ...
{% endfor %}

Trim

トリムフィルターは、文字列の先頭と末尾から空白（またはその他の文字）を削除します。 例えば、 

{{ '  Symfony!  '|trim }}

それは次の結果を生成します- 

Symfony!

関数

Twigは機能をサポートしています。 特定の結果を取得するために使用されます。 以下は、重要なTwig関数の一部です。

属性

*attribute* 関数を使用して、変数の「動的」属性にアクセスできます。 その構文は次のとおりです-
{{ attribute(object, method) }}
{{ attribute(object, method, arguments) }}
{{ attribute(array, item) }}

例えば、 

{{ attribute(object, method) is defined ? 'Method exists' : 'Method does not exist' }}

定数

定数関数は、指定された文字列の定数値を返します。 例えば、 

{{ constant('Namespace\\Classname::CONSTANT_NAME') }}

サイクル

サイクル関数は、値の配列を循環します。 例えば、 

{% set months = [‘Jan’, ‘Feb’, ‘Mar’] %}
{% for x in 0..12 %}
   { cycle(months, x) }}
{% endfor %}

Date

引数を日付に変換して、日付の比較を可能にします。 例えば、 

<p>Choose your location before {{ 'next Monday'|date('M j, Y') }}</p>

それは次の結果を生成します- 

Choose your location before May 15, 2017

引数は、PHPでサポートされている日時形式のいずれかである必要があります。

2番目の引数としてタイムゾーンを渡すことができます。

Dump

ダンプ機能は、テンプレート変数に関する情報をダンプします。 例えば、 

{{ dump(user) }}

Max

max関数は、シーケンスの最大値を返します。 例えば、 

{{ max(1, 5, 9, 11, 15) }}

Min

min関数は、シーケンスの最小値を返します。 例えば、 

{{ min(1, 3, 2) }}

含める

include関数は、テンプレートのレンダリングされたコンテンツを返します。 例えば、 

{{ include('templatel') }}

ランダム

ランダム関数は、ランダムな値を生成します。 例えば、 

{{ random([‘Jan’, ‘Feb’, ‘Mar’, ‘Apr’]) }}
{# example output: Jan #}

範囲

範囲関数は、整数の算術級数を含むリストを返します。 例えば、 

{% for x in range(1, 5) %}
   {{ x }},
{% endfor %}

それは次の結果を生成します- 

1,2,3,4,5

レイアウト

レイアウトは、複数のビューの共通部分を表します。 たとえば、ページヘッダーとフッター。

テンプレートの継承

テンプレートは別のテンプレートで使用できます。 これは、テンプレート継承の概念を使用して実現できます。 テンプレートの継承により、ブロックとして定義されたWebサイトのすべての共通要素を含む基本「レイアウト」テンプレートを構築できます。

テンプレートの継承についてさらに理解するために、簡単な例を見てみましょう。

例

「app/Resources/views/basel.twig」にある基本テンプレートを検討してください。 ファイルに次の変更を追加します。 

*basel.twig*
<!DOCTYPE html>
<html>
   <head>
      <meta charset = "UTF-8">
      <title>{% block title %}Parent template Layout{% endblock %}</title>
   </head>
</html>

次に、_“ app/Resources/views/default/indexl.twig“ _にあるインデックステンプレートファイルに移動します。 以下の変更を追加します。 

*indexl.twig*
{% extends 'basel.twig' %}
{% block title %}Child template Layout{% endblock %}

ここで、 \ {％extends％} タグはテンプレートエンジンに最初にベーステンプレートを評価するように通知します。これにより、レイアウトが設定され、ブロックが定義されます。 その後、子テンプレートがレンダリングされます。 子テンプレートは、基本レイアウトを拡張し、タイトルブロックをオーバーライドできます。 ここで、URL「http：//localhost：8000」をリクエストすると、その結果を取得できます。

資産

アセットは、CSSスタイルシート、JavaScriptファイル、画像ファイルなどのWebアセットのURL生成とバージョン管理を管理します。

JavaScript

JavaScriptファイルを含めるには、任意のテンプレートで javascripts タグを使用します。 

{# Include javascript #}
{% block javascripts %}
   {% javascripts '@AppBundle/Resources/public/js/*' %}
      <script src="{{ asset_url }}"></script>
   {% endjavascripts %}
{% endblock %}

スタイルシート

スタイルシートファイルを含めるには、任意のテンプレートで stylesheets タグを使用します 

{# include style sheet #}
{% block stylesheets %}
   {% stylesheets 'bundles/app/css/*' filter = 'cssrewrite' %}
      <link rel = "stylesheet" href="{{ asset_url }}"/>
   {% endstylesheets %}
{% endblock %}

画像

画像を含めるには、画像タグを使用できます。 次のように定義されています。 

{% image '@AppBundle/Resources/public/images/example.jpg' %}
   <img src = "{{ asset_url }}" alt = "Example"/>
{% endimage %}

複合資産

多くのファイルを1つにまとめることができます。 これにより、HTTP要求の数が減り、フロントエンドのパフォーマンスが向上します。 

{% javascripts
   '@AppBundle/Resources/public/js/*'
   '@AcmeBarBundle/Resources/public/js/form.js'
   '@AcmeBarBundle/Resources/public/js/calendar.js' %}
   <script src = "{{ asset_url }}"></script>
{% endjavascripts %}
「https://www.finddevguides.com/index.php?title=Symfony-view-engine&oldid=30830」から取得
Powered by MediaWiki