Vous êtes sur la page 1sur 96

Symfony 5 : TWIG

Achref El Mouelhi

Docteur de l’université d’Aix-Marseille


Chercheur en Programmation par contrainte (IA)
Ingénieur en Génie logiciel

elmouelhi.achref@gmail.com

H & H: Research and Training 1 / 60


Plan
1 Introduction
2 Commentaire
3 Interpolation
4 Déclaration de variable
5 Opérations sur les variables
6 Structure conditionnelle
7 Structure itérative
8 Filtre
9 Référencement d’un fichier
10 Lien hypertexte
11 Variables globales
12 Inclusion
13 Block et héritage
H & H: Research and Training 2 / 60
Introduction

Symfony

Twig

moteur de templates pour PHP

I c
apparu en 2009
EL H
syntaxe inspirée par Jinja (moteur de template U
M O du framework Django de Python)

issu et utilisé par Symfony


fE L
h r e
c IDE : NetBeans, PhpStorm, Eclipse, Visual Studio
Code... c
A
supporté par plusieurs

supporté par plusieurs éditeurs de texte : Sublime text, notepad++, vim...

Symfony 5 utilise la version 3 de Twig

H & H: Research and Training 3 / 60


Introduction

Symfony
Twig, Pourquoi ?

permet de séparer le code PHP du code html (lisibilité, maintenabilité)

c

offre la possibilité de modifier un fichier sans influencer le deuxième
I
facilite le travail d’équipe ELH
U
L MO
f E
chre
c A

H & H: Research and Training 4 / 60


Introduction

Symfony
Twig, Pourquoi ?

permet de séparer le code PHP du code html (lisibilité, maintenabilité)

c

offre la possibilité de modifier un fichier sans influencer le deuxième
I
facilite le travail d’équipe ELH
U
L MO
f E
Inconvénients
A c hre
c
ralentir le chargement de page

Un langage (de template) de plus à étudier

La gestion d’erreurs est plus compliquée

H & H: Research and Training 4 / 60


Introduction

Symfony

Autres moteurs de template


Smarty
I c

ELH
Liquid
U
Mustache L MO
f E
Plates
chre
c A
Talus’TPL
...

H & H: Research and Training 5 / 60


Introduction

Symfony

Trois types de balises


I c

{% ... %} : pour exécuter une actionUE
LH
unL
{# ... #} : pour définir E
MO
commentaire

c h
{{ ... }} : pour ref
c A
afficher

H & H: Research and Training 6 / 60


Introduction

Avant de commencer, considérons le contenu suivant pour le contrôleur


HomeController

namespace App\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\
AbstractController;
use Symfony\Component\Routing\Annotation\Route;
I c

E L H
U
class HomeController extends AbstractController
{
L MO
fE
/**

*/ h r e
* @Route("/home",name="home_route")
c index()
c A
public function
{
return $this->render(’home/index.html.twig’, [
’controller_name’ => ’HomeController’,
]);
}
}

H & H: Research and Training 7 / 60


Introduction

Symfony

Et le contenu suivant pour index.html.twig


{% extends ’base.html.twig’ %}

I c

{% block title %}Home{% endblock %}
ELH
U
{% block body %}
L MO
f E
<div> chre
c A

<h1>Hello {{ controller_name }}!</h1>

</div>
{% endblock %}

H & H: Research and Training 8 / 60


Commentaire

Symfony

I c

{# commentaire #}
ELH
U
n’affiche rien et ne fait rien
L MO
f E
hre
s’utilise seulement pour les commentaires multi-lignes
c
c A

H & H: Research and Training 9 / 60


Interpolation

Symfony

{{ var }} I c
EL H
O U
permet de récupérer et afficher la valeur d’une variable var
envoyée par le contrôleur L M

h r e f Eecho $var; ?>


A c
est l’équivalent de <?php
c

H & H: Research and Training 10 / 60


Interpolation

Symfony

Le contrôleur HomeController envoie à la vue index.html.twig un


tableau contenant une variable nommée controller name ayant
comme valeur la chaı̂ne de caractères HomeController
return $this->render(’home/index.html.twig’, [
I c

’controller_name’ => ’HomeController’,
ELH
]);
U
L MO
f E
chre
c A

H & H: Research and Training 11 / 60


Interpolation

Symfony

Le contrôleur HomeController envoie à la vue index.html.twig un


tableau contenant une variable nommée controller name ayant
comme valeur la chaı̂ne de caractères HomeController
return $this->render(’home/index.html.twig’, [
I c

’controller_name’ => ’HomeController’,
ELH
]);
U
L MO
re f E
c h
Pour l’afficher, dans index.html.twig
A on utilise l’interpolation
<div> c
<h1>Hello {{ controller_name }}!</h1>
</div>
{% endblock %}

H & H: Research and Training 11 / 60


Interpolation

Symfony

Exercice
I c
Créez un contrôleur TwigController EL H
M OUde récupérer deux
E
paramètres de requêtefnom
Let prenom et les envoyer à la vue
La route de ce contrôleur doit permettre

c h re
c A les valeurs envoyées par le contrôleur
La vue affiche

H & H: Research and Training 12 / 60


Interpolation

Symfony

I c

{{ tableau[’idColonne’] }}
H
affiche le contenu d’un élément du O UEL
tableau
L M$tableau[’idColonne’];
ref
est l’équivalent de <?php E echo
?>
c h
c A

H & H: Research and Training 13 / 60


Interpolation

Symfony
Exemple : contenu de la méthode index de HomeController
$tab = [2, 3, 8];
return $this->render(’home/index.html.twig’, [
’controller_name’ => ’HomeController’,
’tableau’ => $tab
]);
I c

ELH
U
L MO
f E
chre
c A

H & H: Research and Training 14 / 60


Interpolation

Symfony
Exemple : contenu de la méthode index de HomeController
$tab = [2, 3, 8];
return $this->render(’home/index.html.twig’, [
’controller_name’ => ’HomeController’,
’tableau’ => $tab
]);
I c

ELH
U
MO
Pour afficher le tableau dans index.html.twig : trois écritures correctes
L
f E
hre
<ul>
<li>
c
c A
{{ tableau[0] }}
</li>
<li>

{{ tableau[’1’] }}
</li>
<li>
{{ tableau["2"] }}
</li>
</ul>

H & H: Research and Training 14 / 60


Interpolation

{{ objet.attribut }}

affiche, logiquement, la valeur de $ attribut de $objet

est l’équivalent de <?php echo $objet->attribut(); ?>

I c

ELH
U
L MO
f E
chre
c A

H & H: Research and Training 15 / 60


Interpolation

{{ objet.attribut }}

affiche, logiquement, la valeur de $ attribut de $objet

est l’équivalent de <?php echo $objet->attribut(); ?>

I c

Réellement {{ objet.attribut }}

ELH
U
MO
affiche $objet[’attribut’] si $objet est un tableau

E L
affiche $objet-> attribut si $objet est un objet et $ attribut est public
f
hre
affiche $objet->attribut() si $objet est un objet et attribut() est une méthode
c
c A
public

affiche $objet->getAttribut() si $objet est un objet et getAttribut() est une
méthode public

affiche $objet->isAttribut() si $objet est un objet et isAttribut() est une


méthode public

n’affiche rien et retourne null sinon.

H & H: Research and Training 15 / 60


Interpolation

Pour l’exemple, commençons par créer une entité Personne dans src/Entity

namespace App\Entity;

class Personne
{
private $_num;
private $_nom;
private $_prenom;
I c

ELH
public function __construct(int $_num, string $_nom, string
$_prenom)
U
MO
{
$this->_num = $_num;
$this->_nom = $_nom;
f E L
hre
$this->_prenom = $_prenom;
c
c A
}


// + getters + setters

public function __toString(): string


{
return $this->_num . " " . $this->_nom . " " . $this->_prenom;
}
}

H & H: Research and Training 16 / 60


Interpolation

Dans HomeController, créons une instance de Personne

namespace App\Controller;

use App\Entity\Personne;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Routing\Annotation\Route;

class HomeController extends AbstractController


I c

{
/**
ELH
U
MO
* @Route("/home",name="home_route")
*/
public function index()
f E L
hre
{
c
c A
$personne = new Personne(100, "wick", "john");


$tab = [2, 3, 8];
return $this->render(’home/index.html.twig’, [
’controller_name’ => ’HomeController’,
’tableau’ => $tab,
’personne’ => $personne
]);
}
}

H & H: Research and Training 17 / 60


Interpolation

Symfony
Pour afficher les attributs de l’objet Personne dans la vue
<ul>
<li>
{{ personne.num }}
I c

</li>
ELH
U
<li>
L MO
f E
hre
{{ personne.nom() }}
</li> c
c A
<li>
{{ personne.getPrenom() }}
</li>
</ul>

H & H: Research and Training 18 / 60


Interpolation

Symfony

{{ variable1 ∼ " " ∼ variable2 }}

affiche le résultat de la concaténation de variable1 et


variable2
I c
est l’équivalent de E L H
<?php echo $variable1 . ’ O U
L M ’ . $variable2 ; ?>
h r e fE
A c
c

H & H: Research and Training 19 / 60


Interpolation

Symfony

{{ variable1 ∼ " " ∼ variable2 }}

affiche le résultat de la concaténation de variable1 et


variable2
I c
est l’équivalent de E L H
<?php echo $variable1 . ’ O U
L M ’ . $variable2 ; ?>
h r e fE
A c
Exemple de c
concaténation
<p>
{{ personne.prenom ˜ " " ˜ personne.nom }}
</p>

H & H: Research and Training 19 / 60


Interpolation

Symfony

I c

H
EL dump
Pour le débogage, vous pouvez utiliser la fonction
U
{{ dump(personne) }}
L MO
h r e fE
A c
c

H & H: Research and Training 20 / 60


Déclaration de variable

Symfony
Utilisez le mot-clé set pour déclarer une variable str dans un bloc {% ... %}
{% set str = ’bonjour’ %}

I c

ELH
U
L MO
f E
chre
c A

H & H: Research and Training 21 / 60


Déclaration de variable

Symfony
Utilisez le mot-clé set pour déclarer une variable str dans un bloc {% ... %}
{% set str = ’bonjour’ %}

L’équivalent PHP
I c

<?php
ELH
U
MO
$str = ’bonjour’;
?>

f E L
chre
c A

H & H: Research and Training 21 / 60


Déclaration de variable

Symfony
Utilisez le mot-clé set pour déclarer une variable str dans un bloc {% ... %}
{% set str = ’bonjour’ %}

L’équivalent PHP
I c

<?php
ELH
U
MO
$str = ’bonjour’;
?>

f E L
A chre
c

Pour afficher la variable str
{{ str }}

H & H: Research and Training 21 / 60


Déclaration de variable

Symfony
Utilisez le mot-clé set pour déclarer une variable str dans un bloc {% ... %}
{% set str = ’bonjour’ %}

L’équivalent PHP
I c

<?php
ELH
U
MO
$str = ’bonjour’;
?>

f E L
A chre
c

Pour afficher la variable str
{{ str }}

Le mot-clé set permet aussi de modifier le contenu de la variable si elle existe


{% set str = ’bonjour’ %}

H & H: Research and Training 21 / 60


Déclaration de variable

Symfony
On peut utiliser le mot-clé with pour donner une portée locale à une variable

{% with %}
{% set x = 2 %}
{{ x }}
{# affiche 2 #}
I c

{% endwith %}
ELH
{# la variable x n’est plus visible iciU
MO
#}

fE L
c h r e
c A

H & H: Research and Training 22 / 60


Déclaration de variable

Symfony
On peut utiliser le mot-clé with pour donner une portée locale à une variable

{% with %}
{% set x = 2 %}
{{ x }}
{# affiche 2 #}
I c

{% endwith %}
ELH
{# la variable x n’est plus visible iciU
MO
#}

fE L
h r e
csans set
c A
Une deuxième écriture

{% with { x: 2 } %}
{{ x }}
{# affiche 2 #}
{% endwith %}

{# la variable x n’est plus visible ici #}

H & H: Research and Training 22 / 60


Déclaration de variable

Symfony
Dans un bloc with, par défaut, on a accès aux variables définies dans le contexte global

{% set y = 5 %}
{% with { x: 2 } %}
{{ x }} {{ y }}
{# affiche 2 5 #}
I c

{% endwith %}

ELH
{# la variable x n’est plus visible ici #}
U
L MO
f E
chre
c A

H & H: Research and Training 23 / 60


Déclaration de variable

Symfony
Dans un bloc with, par défaut, on a accès aux variables définies dans le contexte global

{% set y = 5 %}
{% with { x: 2 } %}
{{ x }} {{ y }}
{# affiche 2 5 #}
I c

{% endwith %}

ELH
{# la variable x n’est plus visible ici #}
U
L MO
f E
chre
Une deuxième écriture sans set

{% set y = 5 %} c A

{% with { x: 2 } only %}
{{ x }}
{# affiche 2 et la variable y n’est plus accessible #}
{% endwith %}

{# la variable x n’est plus visible ici #}

H & H: Research and Training 23 / 60


Opérations sur les variables

Symfony

Dans un bloc with, par défaut, on a accès aux variables définies


dans le contexte global I c

ELH
{% set x = 2 %} U
{% set y = 5 %}
L MO
f E
hre
{{ x + y }}
c
{# affiche 7 #} c A

H & H: Research and Training 24 / 60


Opérations sur les variables

Symfony

Autres opérations

Arithmétiques : +, -, *, /, %, ** (puissance) et // (division I c



entière) ELH
U
Logiques : and, or et not
L MO
re f E
c h
Comparaisons : ==, !=, <, >, >=, <=, ===, starts with, ends

c A
with, matches
Autres : is, in, [], ., .., ??, ?:

H & H: Research and Training 25 / 60


Opérations sur les variables

Symfony
Exemple avec in
{{ 8 in tableau }}
{# affiche 1 #}

I c

ELH
U
L MO
f E
c hre
c A

H & H: Research and Training 26 / 60


Opérations sur les variables

Symfony
Exemple avec in
{{ 8 in tableau }}
{# affiche 1 #}

I c

ELH
U
MO
Exemple avec not in
{{ 1 not in tableau }}
f E L
{# affiche 1 #}
c hre
c A

H & H: Research and Training 26 / 60


Opérations sur les variables

Symfony
Exemple avec in
{{ 8 in tableau }}
{# affiche 1 #}

I c

ELH
U
MO
Exemple avec not in
{{ 1 not in tableau }}
f E L
{# affiche 1 #}
c hre
c A

Exemple avec starts with
{{ personne.prenom starts with ’j’ }}
{# affiche 1 #}

H & H: Research and Training 26 / 60


Opérations sur les variables

Symfony

I c

H
Exemple avec matches permet de déterminer si une variable
EL
U
respecte un motif donné par une expression régulière
O
{{ personne.prenom matches M
fE L ’/ˆj.*n$/’ }}
{# affiche 1 #}
c h r e
c A

H & H: Research and Training 27 / 60


Structure conditionnelle

Symfony

Exemple avec if ... endif


{% if tableau[0] > 0 %}
{{ tableau[0] }} est positif
{% endif %}
I c

ELH
U
L MO
f E
chre
c A

H & H: Research and Training 28 / 60


Structure conditionnelle

Symfony

Exemple avec if ... endif


{% if tableau[0] > 0 %}
{{ tableau[0] }} est positif
{% endif %}
I c

ELH
U
L MO
Exemple avec if ... else ... endif
f E
chre
c A
{{ tableau[0] }} est

{% if tableau[0] > 0 %}
positif
{% else %}
négatif
{% endif %}

H & H: Research and Training 28 / 60


Structure conditionnelle

Symfony

Exemple avec if ... elsif ... else ... endif


{{ tableau[0] }}
I c

{% if tableau[0] > 0 %}
ELH
U
MO
positif
{% elseif tableau[0] < 0 %}
f E L
hre
négatif
c
c A
{% else %}
nul
{% endif %}

H & H: Research and Training 29 / 60


Structure conditionnelle

Symfony

Tester l’existence d’une variable


{% if nom is defined %}
{{ nom }}
I c

{% else %}
ELH
doe
U
{% endif %}
L MO
f E
chre
c A

H & H: Research and Training 30 / 60


Structure conditionnelle

Symfony

Tester l’existence d’une variable


{% if nom is defined %}
{{ nom }}
I c

{% else %}
ELH
doe
U
{% endif %}
L MO
f E
chre
c A

Tester la parité d’une variable
{% if tableau[0] is even %}
{{ tableau[0] }} est pair
{% endif %}

H & H: Research and Training 30 / 60


Structure conditionnelle

Symfony

Tester si une variable est divisible par 2


{% if tableau[0] is divisible by(2) %}
I c

{{ tableau[0] }} est pair
ELH
{% endif %} U
L MO
f E
chre
c A

H & H: Research and Training 31 / 60


Structure conditionnelle

Symfony

Tester si une variable est divisible par 2


{% if tableau[0] is divisible by(2) %}
I c

{{ tableau[0] }} est pair
ELH
{% endif %} U
L MO
f E
chre
c A

Autres fonctions de test prédéfinies
https://twig.symfony.com/doc/3.x/tests/index.html

H & H: Research and Training 31 / 60


Structure itérative

Symfony

Structure itérative : for


{% for i in tableau %}
{{ i }} <br> I c

{% endfor %}
ELH
U
L MO
f E
chre
c A

H & H: Research and Training 32 / 60


Structure itérative

Symfony

Structure itérative : for


{% for i in tableau %}
{{ i }} <br> I c

{% endfor %}
ELH
U
L MO
f E
Le résultat
chre
2 c A

3
8

H & H: Research and Training 32 / 60


Structure itérative

Symfony

On peut utiliser l’opérateur .. pour définir un intervalle


{% for i in 0..3 %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
chre
c A

H & H: Research and Training 33 / 60


Structure itérative

Symfony

On peut utiliser l’opérateur .. pour définir un intervalle


{% for i in 0..3 %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
Le résultat
chre
0
1
c A

2
3

H & H: Research and Training 33 / 60


Structure itérative

Symfony

On peut aussi utiliser la fonction range


{% for i in range(0, 3) %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
chre
c A

H & H: Research and Training 34 / 60


Structure itérative

Symfony

On peut aussi utiliser la fonction range


{% for i in range(0, 3) %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
Le résultat
chre
0
1
c A

2
3

H & H: Research and Training 34 / 60


Structure itérative

Symfony

On peut aussi modifier le pas


{% for i in range(low=0, high=7, step=2) %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
chre
c A

H & H: Research and Training 35 / 60


Structure itérative

Symfony

On peut aussi modifier le pas


{% for i in range(low=0, high=7, step=2) %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
Le résultat
chre
0
2
c A

4
6

H & H: Research and Training 35 / 60


Structure itérative

Symfony
On peut utiliser l’opérateur .. pour définir un intervalle de
caractères
{% for i in ’a’..’f’ %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
chre
c A

H & H: Research and Training 36 / 60


Structure itérative

Symfony
On peut utiliser l’opérateur .. pour définir un intervalle de
caractères
{% for i in ’a’..’f’ %}
{{ i }} <br>
I c

{% endfor %}
ELH
U
L MO
f E
hre
Le résultat
c
a
b
c A

c
d
e
f

H & H: Research and Training 36 / 60


Structure itérative

Symfony

Structure itérative : for (clé, valeur)


{% for cle, valeur in tableau %}
{{ cle ˜ ’ : ’ ˜ valeur }} <br> I c

{% endfor %}
ELH
U
L MO
f E
chre
c A

H & H: Research and Training 37 / 60


Structure itérative

Symfony

Structure itérative : for (clé, valeur)


{% for cle, valeur in tableau %}
{{ cle ˜ ’ : ’ ˜ valeur }} <br> I c

{% endfor %}
ELH
U
L MO
f E
Le résultat
chre
0 : 2 c A

1 : 3
2 : 8

H & H: Research and Training 37 / 60


Structure itérative

Symfony

La boucle for génère un objet loop contenant les attributs suivants :

I c
loop.index : numéro de l’itération courante (commence de 1)
H
EL (commence de 0)
loop.index0 : numéro de l’itération courante
loop.length : le nombre totalM d’itO
U
érations
L
E s’il s’agit de la première itération
ftrue
h r e
loop.first : contient
c true s’il s’agit de la dernière itération
c

loop.last
A: contient
loop.revindex et loop.revindex0 : contiennent le nombre
d’itérations restantes avant la fin de la boucle

H & H: Research and Training 38 / 60


Structure itérative

Symfony

Exemple
{% for valeur in tableau %}
{{ loop.index0 }} : {{ c

valeur }}
I
<br>
ELH
{% endfor %} U
L MO
f E
chre
c A

H & H: Research and Training 39 / 60


Structure itérative

Symfony

Exemple
{% for valeur in tableau %}
{{ loop.index0 }} : {{ c

valeur }}
I
<br>
ELH
{% endfor %} U
L MO
f E
chre
Le résultat
0 : 2
c A

1 : 3
2 : 8

H & H: Research and Training 39 / 60


Filtre

Symfony

Filtre

I
Permettant de formater et modifier l’affichage d’une donnée c
EL H
Pouvant prendre un ou plusieurs paramètres
O U
Synatxe : {{ variable | E L M
fonction filtre[paramètres] }}
r e f
A ch un filtre sur le résultat d’un autre filtre
Possibilité d’appliquer
c
Liste complète :
https://twig.symfony.com/doc/3.x/filters/index.html

H & H: Research and Training 40 / 60


Filtre

Symfony

Quelques exemples
upper : convertit les lettres en majuscules comme strtupper()
en PHP (lower est la réciproque)
I c
length : calcule le nombre d’éléments d’unL H
E tableau ou le nombre
U
de caractères d’une chaı̂ne
L MO
r e E tableau
sort : trie les élémentsf d’un

A
trim : supprime
h
c les caractères spéciaux indiqués du début et de
c
la fin d’une chaı̂ne de caractères
striptags : supprime les balises HTML
...

H & H: Research and Training 41 / 60


Filtre

symfony
Exemples avec les chaı̂nes de caractères

{{ personne.prenom | capitalize ˜ " " ˜ personne.nom | upper }}


{# affiche John WICK #}

{{ personne.prenom | length }}
I c

{# affiche 4 #}
ELH
U
{{ ’ john wick! ’ | trim }}
L MO
{# affiche ’john wick!’ #}
f
re }} E
{{ ’ john wick!’ |h
c trim(’!’)

c A wick’ #}
{# affiche ’ john

{{ ’ john wick! ’ | trim(side=’left’) }}


{# affiche ’john wick! ’ #}

{{ ’ john wick! ’ | trim(’ ’, ’right’) }}


{# affiche ’ john wick!’ #}

H & H: Research and Training 42 / 60


Filtre

symfony

I c

Pour appliquer un filtre à une portion du code
ELH
{% apply upper %}
U
O}}
M
Bonjour {{ personne.prenom
L
{% endapply %}
h r e fE
A c
{# affiche BONJOUR JOHN #}

H & H: Research and Training 43 / 60


Filtre

symfony

Exemples avec les tableaux (slice)


{% for elt in tableau | slice(0, 2) %}
{{ elt }}
I c

{% endfor %}
ELH
{# affiche 2 3 #}
U
L MO
f E
chre
c A

H & H: Research and Training 44 / 60


Filtre

symfony

Exemples avec les tableaux (slice)


{% for elt in tableau | slice(0, 2) %}
{{ elt }}
I c

{% endfor %}
ELH
{# affiche 2 3 #}
U
L MO
re f E
h
Un raccourci pourcslice

{% for eltc inAtableau [0:2] %}
{{ elt }}
{% endfor %}
{# affiche 2 3 #}

H & H: Research and Training 44 / 60


Filtre

symfony

Au moins un des deux paramètres doit être présent dans [ : ]


{% for elt in tableau [:1] %}
{{ elt }}
I c

{% endfor %}
ELH
{# affiche 2 #}
U
L MO
f E
chre
c A

H & H: Research and Training 45 / 60


Filtre

symfony

Au moins un des deux paramètres doit être présent dans [ : ]


{% for elt in tableau [:1] %}
{{ elt }}
I c

{% endfor %}
ELH
{# affiche 2 #}
U
L MO
f E
e ètres doit être présent dans [ : ]
rparam
c h
Au moins un des deux

{% for eltc inAtableau [1:] %}
{{ elt }}
{% endfor %}
{# affiche 3 8 #}

H & H: Research and Training 45 / 60


Filtre

symfony
Exemples avec les tableaux (reduce)

{{ tableau | reduce((somme, valeur) => somme + valeur) }}


{# affiche 13 #}

I c

ELH
U
L MO
f E
chre
c A

H & H: Research and Training 46 / 60


Filtre

symfony
Exemples avec les tableaux (reduce)

{{ tableau | reduce((somme, valeur) => somme + valeur) }}


{# affiche 13 #}

I c
EL H
reduce accepte aussi une valeur initiale
U
{{ tableau | reduce((somme, valeur)
L MO
=> somme + valeur, 5) }}
{# affiche 18 #}
ref E
c h
c A

H & H: Research and Training 46 / 60


Filtre

symfony
Exemples avec les tableaux (reduce)

{{ tableau | reduce((somme, valeur) => somme + valeur) }}


{# affiche 13 #}

I c
EL H
reduce accepte aussi une valeur initiale
U
{{ tableau | reduce((somme, valeur)
L MO
=> somme + valeur, 5) }}
{# affiche 18 #}
ref E
c h
c A
Exemple avec map et reduce

{{ tableau | map(elt => elt + 2) | reduce((somme, valeur) =>


somme + valeur) }}
{# affiche 19 #}

H & H: Research and Training 46 / 60


Filtre

Symfony

Remarques

I c

Par défaut, Twig protège les variables en appliquant un filtre pour
les protéger de balises HTML
EL H
Pour désactiver le filtre, on peutM
U
O le filtre raw
utiliser
Par exemple {{ variable L
f E | raw }}
h r e
c de caractères non-définies dans une variable, on
A
Pour les chaı̂nes
c
utilise
e pour échapper les balises HTML
Par exemple {{ ’texte <br>’ | e }}

H & H: Research and Training 47 / 60


Filtre

symfony

Exemple (chaine est une variable définie dans le contrôleur


contenant la valeur bonjour)
{{ ’hello <br>’ }}
I c

{# affiche hello #}
ELH
U
{{ ’hello <br>’ | e }}
L MO
{# affiche hello <br> #}
f E
chre
{{ chaine }}
c A

{# affiche bonjour<br> #}

{{ chaine | raw }}
{# affiche bonjour #}

H & H: Research and Training 48 / 60


Filtre

Pour interpréter les différentes balises définies dans la variable test

{% set test = "<strong>Texte en gras</strong>


<script>
alert(’Ceci est un avertissement’)
</script>" %}

{{ test | raw }}

I c

ELH
U
L MO
f E
chre
c A

H & H: Research and Training 49 / 60


Filtre

Pour interpréter les différentes balises définies dans la variable test

{% set test = "<strong>Texte en gras</strong>


<script>
alert(’Ceci est un avertissement’)
</script>" %}

{{ test | raw }}

I c

ELH
U
MO
On peut aussi le faire avec autoescape

{% autoescape false %}
f E L
hre
{{ test }}
{% endautoescape %}
c
c A

H & H: Research and Training 49 / 60


Filtre

Pour interpréter les différentes balises définies dans la variable test

{% set test = "<strong>Texte en gras</strong>


<script>
alert(’Ceci est un avertissement’)
</script>" %}

{{ test | raw }}

I c

ELH
U
MO
On peut aussi le faire avec autoescape

{% autoescape false %}
f E L
hre
{{ test }}
{% endautoescape %}
c
c A

Avec autoescape, on peut choisir la stratégie d’échappement (html, js, css...)

{% autoescape ’html’ %}
{{ test }}
{% endautoescape %}

H & H: Research and Training 49 / 60


Référencement d’un fichier

Symfony

Caractéristiques

Elle permet de faire référence au répertoire web du projet Symfony depuis les
vues
I c

H
EL (CSS, JavaScript,
Elle permet donc de référencer des fichiers de ressource
U
MO
images ...) définis dans public

fE L
c h r e
c A

H & H: Research and Training 50 / 60


Référencement d’un fichier

Symfony

Caractéristiques

Elle permet de faire référence au répertoire web du projet Symfony depuis les
vues
I c

H
EL (CSS, JavaScript,
Elle permet donc de référencer des fichiers de ressource
U
MO
images ...) définis dans public

fE L
c h r e
Exemples
c A
<link href="{{ asset(’css/style.css’) }}" rel="stylesheet" />
<script src="{{ asset(’js/jquery-1.11.3.js’) }}"></script>
<script src="{{ asset(’js/bootstrap.js’) }}"></script>
<script src="{{ asset(’js/script.js’) }}"></script>

H & H: Research and Training 50 / 60


Lien hypertexte

Symfony
path et url

Elles permettent de référencer une route enregistrée dans notre routeur

path génère une URL relative.


I c

url génère une URL absolue.
ELH
U
L MO
f E
chre
c A

H & H: Research and Training 51 / 60


Lien hypertexte

Symfony
path et url

Elles permettent de référencer une route enregistrée dans notre routeur

path génère une URL relative.


I c

url génère une URL absolue.
ELH
U
L MO
f E
Exemple
chre
c A

<a href="{{ path(’vehicule_route’) }}">Véhicule</a>
<a href="{{ url(’vehicule_route’) }}">Véhicule</a>

H & H: Research and Training 51 / 60


Lien hypertexte

Symfony
path et url

Elles permettent de référencer une route enregistrée dans notre routeur

path génère une URL relative.


I c

url génère une URL absolue.
ELH
U
L MO
f E
Exemple
chre
c A

<a href="{{ path(’vehicule_route’) }}">Véhicule</a>
<a href="{{ url(’vehicule_route’) }}">Véhicule</a>

Code HTML équivalent


<a href="/vehicule">Accueil</a>
<a href="http://localhost:8000/vehicule">Véhicule</a>
H & H: Research and Training 51 / 60
Lien hypertexte

Symfony

I c

H
On peut aussi construire une route avec paramètres
EL ’value’})
U
MO
<a href="{{ path(’vehicule_route’,{’id’:
}}">Véhicule</a>
fE L
c h r e
<a href="{{ url(’vehicule_route’) }}">Véhicule</a>

c A

H & H: Research and Training 52 / 60


Variables globales

Symfony

Les variables globales

app.request : la requête d’un contrôleur


app.session : service session
I c
app.user : pour récupérer l’utilisateurU EL
courant
H
M O
E
app.debug : True si le mode L debug est activé, False sinon.
fl’environnement
c h
app.environment r e: courant dev ou prod
c
A

H & H: Research and Training 53 / 60


Variables globales

Symfony

Les variables globales

app.request : la requête d’un contrôleur


app.session : service session
I c
app.user : pour récupérer l’utilisateurU EL
courant
H
M O
E
app.debug : True si le mode L debug est activé, False sinon.
fl’environnement
c h
app.environment r e: courant dev ou prod
c
A
Exemple
{% set id = app.request.get(’personne’).nom %}

H & H: Research and Training 53 / 60


Inclusion

Symfony

Considérons la page menu.twig à définir directement dans


templates
<ul>
I c

<li>
ELH
U
<a href="{{ url(’home_route’) }}">Home</a>
L MO
</li>
f E
<li>
chre
c A
<a href="{{ url(’vehicule_route’) }}">Vehicule</
a>
</li>
</ul>

H & H: Research and Training 54 / 60


Inclusion

Symfony

Pour inclure le menu dans la vue associée à HomeController


{% include ’menu.twig’ %}

I c

ELH
U
L MO
f E
chre
c A

H & H: Research and Training 55 / 60


Inclusion

Symfony

Pour inclure le menu dans la vue associée à HomeController


{% include ’menu.twig’ %}

I c
EL H
U
Inclusion avec ignorance d’erreur si page inexistante
L MOmissing %}
h r e fE
{% include ’page.twig’ ignore

A c
c

H & H: Research and Training 55 / 60


Inclusion

Symfony

Pour inclure le menu dans la vue associée à HomeController


{% include ’menu.twig’ %}

I c
EL H
U
Inclusion avec ignorance d’erreur si page inexistante
L MOmissing %}
h r e fE
{% include ’page.twig’ ignore

A c
c
Notion d’inclusion conditionnelle
{% include condition ? ’menu-admin.twig’ : ’menu-
user.twig’ ignore missing %}}

H & H: Research and Training 55 / 60


Inclusion

Symfony
Pour inclure le menu, on peut créer une méthode dans HomeController et lui
associer une route

/**
* @Route("/menu",name="menu_route")
*/
I c

public function menu()
ELH
{
U
return $this->render(’menu.twig’, []);
L MO
}
f E
chre
c A

H & H: Research and Training 56 / 60


Inclusion

Symfony
Pour inclure le menu, on peut créer une méthode dans HomeController et lui
associer une route

/**
* @Route("/menu",name="menu_route")
*/
I c

public function menu()
ELH
{
U
return $this->render(’menu.twig’, []);
L MO
}
f E
A c hre
c
cette méthode dans la vue, on utilise la fonction render
Pour exécuter

{{ render("menu") }}

H & H: Research and Training 56 / 60


Inclusion

Symfony
Pour inclure le menu, on peut créer une méthode dans HomeController et lui
associer une route

/**
* @Route("/menu",name="menu_route")
*/
I c

public function menu()
ELH
{
U
return $this->render(’menu.twig’, []);
L MO
}
f E
A c hre
c
cette méthode dans la vue, on utilise la fonction render
Pour exécuter

{{ render("menu") }}

Attention à la performance de la fonction render

H & H: Research and Training 56 / 60


Block et héritage

Symfony

I c

Notion de block : zone réservée
ELH
U
MO
{% block nom_block %}
...
f E L
hre
{% endblock %}
c
c A

H & H: Research and Training 57 / 60


Block et héritage

Symfony
Exemple

{# base.html.twig #}
<!DOCTYPE html>
<html>
<head>
I c

<meta charset="UTF-8">
ELH
<title>
U
{% block title %}Welcome!{% endblock %}
L MO
</title>
f E
hre
{% block stylesheets %}{% endblock %}
c
<link href="{{ asset(’css/style.css’) }}" rel="stylesheet"/
>
</head> c A

<body>
{% block body %}{% endblock %}
{% block javascripts %}{% endblock %}
</body>
</html>

H & H: Research and Training 58 / 60


Block et héritage

Symfony

Héritage entre block


{% extends ’base.html.twig’ %}

{% block title %}
I c

Home
ELH
U
MO
{# ce contenu sera inséré dans le bloc title de base.
html.twig #}
f E L
hre
{% endblock %}
c
{% block body %}
c A

{# contenu précédent #}
{# ce contenu sera inséré dans le bloc body de base.
html.twig #}
{% endblock %}

H & H: Research and Training 59 / 60


Block et héritage

Symfony

Remarques

I c

ELH
L’héritage sert à créer un template parent (avec un ou plusieurs blocks) qui contient le

U
design de base de notre site pour que les templates enfants puissent l’utiliser

L MO
Si le template enfant ne redéfinit pas un block hérité, il aura la valeur définie par le père
pour ce block
f E
c hre
{{ parent() }} permet de récupérer le contenu du block côté père

c A

On peut faire des include pour ajouter entièrement un template

H & H: Research and Training 60 / 60

Vous aimerez peut-être aussi