framework-web:symfony:templates

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision
Révision précédente
framework-web:symfony:templates [2018/01/29 20:15] – [Filtres] jcheronframework-web:symfony:templates [2019/08/31 14:21] (Version actuelle) – modification externe 127.0.0.1
Ligne 49: Ligne 49:
 ^format | Insère des variables dans un texte, équivalent à printf. |  <sxh html;gutter:false>{{ "Il y a %s pommes et %s poires"|format(153, nb_poires) }}</sxh> | ^format | Insère des variables dans un texte, équivalent à printf. |  <sxh html;gutter:false>{{ "Il y a %s pommes et %s poires"|format(153, nb_poires) }}</sxh> |
 ^length | Retourne le nombre d'éléments du tableau, ou le nombre de caractères d'une chaîne. |  <sxh html;gutter:false>Longueur de la variable : {{ texte|length }}</sxh> | ^length | Retourne le nombre d'éléments du tableau, ou le nombre de caractères d'une chaîne. |  <sxh html;gutter:false>Longueur de la variable : {{ texte|length }}</sxh> |
 +^raw| Désactive l'auto-escape sur l'affichage de la variable. |  <sxh html;gutter:false>Elément HTML : {{ element|raw }}</sxh> |
 ==== Faire {{#...}} ==== ==== Faire {{#...}} ====
  
Ligne 75: Ligne 75:
     {% endfor %}     {% endfor %}
 </ul> </ul>
 +</sxh>
 +
 +=== Fonctions utiles ===
 +== attribute ==
 +Permet d'accéder au membre d'un objet :
 +
 +<sxh html>
 +{{ attribute(object, method) }}
 +{{ attribute(object, method, arguments) }}
 +{{ attribute(array, item) }}
 +</sxh>
 +
 +== isDefined ==
 +
 +Test l'affectation d'une variable (isset de php)
 +<sxh html;gutter:false>
 +{% if var is defined %} … {% endif %}
 +</sxh>
 +
 +
 +===== Structuration de template =====
 +
 +Très souvent, les templates ont besoin de partager certains éléments : header, footer, barres de menus...
 +
 +Twig permet de répondre à cette problématique à partir de l'héritage et des blocs dans les templates :
 +
 +Soit un template père définissant le style, ainsi que quelques bloc nommés affichant ou non du contenu.\\
 +Il est possible de créer des templates fils héritant du père et remplaçant ou ajoutant leur propre contenu dans les blocs définis.\\
 +
 +C'est ainsi que Twig permet de structurer un ensemble de pages, en uniformisant la présentation et en évitant les répétitions de code.
 +
 +==== Héritage et blocs ====
 +
 +Soit le template principal suivant :
 +
 +<sxh html;title:templates/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>
 +</sxh>
 +
 +
 +Il est possible de définir un template enfant de la façon suivante :
 +
 +<sxh html;title:templates/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 %}
 +</sxh>
 +
 +==== Parent ====
 +
 +Il est possible de réutiliser le contenu affiché un bloc du template parent en utilisant la fonction **parent()** :
 +
 +<sxh html>
 +{% block sidebar %}
 +    <h3>Table of Contents</h3>
 +
 +    {# ... #}
 +
 +    {{ parent() }}
 +{% endblock %}
 +</sxh> 
 +==== Inclusion ====
 +
 +Soit le template suivant affichant le détail d'un article :
 +
 +<sxh html;title:templates/article/article_details.html.twig>
 +<h2>{{ article.title }}</h2>
 +<h3 class="byline">by {{ article.authorName }}</h3>
 +
 +<p>
 +    {{ article.body }}
 +</p>
 +</sxh>
 +
 +Il est possible de réutiliser ce template pour afficher la liste des articles, par inclusion :
 +
 +<sxh html;title:templates/article/list.html.twig>
 +{% extends 'layout.html.twig' %}
 +
 +{% block body %}
 +    <h1>Recent Articles<h1>
 +
 +    {% for article in articles %}
 +        {{ include('article/article_details.html.twig', { 'article': article }) }}
 +    {% endfor %}
 +{% endblock %}
 +</sxh>
 +
 +
 +===== Liens =====
 +
 +Soit la route suivante définie dans le contrôleur Welcome :
 +
 +<sxh php;title:src/Controller/WelcomeController.php>
 +use Symfony\Component\Routing\Annotation\Route;
 +
 +class WelcomeController extends Controller
 +{
 +    /**
 +     * @Route("/", name="welcome")
 +     */
 +    public function index()
 +    {
 +        // ...
 +    }
 +}
 +</sxh>
 +
 +Il est possible de générer l'url correspondant à cette route en passant à la fonction **path** la propriété **name** de la route : welcome
 +<sxh html;gutter:false>
 +<a href="{{ path('welcome') }}">Home</a>
 +</sxh>
 +
 +
 +Génération de route avec paramètres :
 +
 +<sxh php;title:src/Controller/ArticleController.php>
 +use Symfony\Component\Routing\Annotation\Route;
 +
 +class ArticleController extends Controller
 +{
 +    /**
 +     * @Route("/article/{slug}", name="article_show")
 +     */
 +    public function show($slug)
 +    {
 +        // ...
 +    }
 +}
 +</sxh>
 +
 +<sxh html;title:templates/article/recent_list.html.twig>
 +{% for article in articles %}
 +    <a href="{{ path('article_show', {'slug': article.slug}) }}">
 +        {{ article.title }}
 +    </a>
 +{% endfor %}
 +</sxh>
 +
 +Génération d'url absolue, à partir de la function **url()** :
 +
 +<sxh html>
 +<a href="{{ url('welcome') }}">Home</a>
 </sxh> </sxh>
  
  • framework-web/symfony/templates.1517253359.txt.gz
  • Dernière modification : il y a 6 ans
  • (modification externe)