Symfony : – Le Twig

Symfony : – Le Twig

Twig est un langage de templating puissant, conçu pour gérer efficacement la couche de présentation dans une application Symfony. Il propose une syntaxe simple et intuitive pour travailler avec des variables, des boucles, des conditions, et plus encore, tout en offrant des mécanismes robustes pour la sécurité et l’organisation des templates.

Les différents instructions

Twig propose trois principaux types de notations pour structurer ses templates :

  1. Instructions logiques (
    {% ... %}

    ) :

    • Ces instructions servent à exécuter des actions ou à définir des blocs.
    • Exemple :
      {% extends 'base.html.twig' %}
      {% block title %}Mon Titre{% endblock %}
      
  2. Expressions d’affichage ( {{ ... }} ) : Utilisées pour afficher des données ou des résultats calculés. Exemple : {{ titre }} {{ parent() }} Commentaires ( {# ... #} ) : Permettent d’ajouter des remarques non visibles dans le code généré. Exemple : {# Ce commentaire sera ignoré lors du rendu #}
Manipulation des variables a) Passer des variables depuis le contrôleur Dans Symfony, les variables sont passées aux templates via le deuxième paramètre de la méthode render() . Exemple dans un contrôleur : namespace App\Controller; use Symfony\Bundle\FrameworkBundle\Controller\AbstractController; use Symfony\Component\HttpFoundation\Response; class DefaultController extends AbstractController { #[Route("/")] public function index(): Response { return $this->render( 'default/index.html.twig', [ 'titre' => 'Bienvenue à tous', 'bonjours' => ['Hello', 'Bonjour', 'Hallo'], ] ); } } Template correspondant : {% extends 'base.html.twig' %} {% block title %} {{ titre }} {% endblock %} {% block body %} {% for bonjour in bonjours %} {{ bonjour }}<br /> {% endfor %} {% endblock %} HTML généré : <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Bienvenue à tous</title> </head> <body> Hello<br /> Bonjour<br /> Hallo<br /> </body> </html> b) Travailler avec des tableaux et objets Twig permet d’accéder facilement aux propriétés des tableaux et des objets à l’aide de la notation pointée ( . ). Exemple : {{ produit.nom }} {{ utilisateur.adresse.ville }} Twig suit cette priorité pour accéder à une valeur : $variable['valeur'] si l’objet implémente ArrayAccess . $variable->valeur (propriété publique). $variable->valeur() (méthode). $variable->getValeur() ou $variable->isValeur() . Structures de contrôle et boucles a) Les conditions Twig prend en charge les structures conditionnelles de type if / elseif / else . Exemple : {% if langue == 'fr' %} Bienvenue! {% elseif langue == 'de' %} Willkommen! {% else %} Welcome! {% endif %} b) Les boucles Twig permet de parcourir des tableaux ou objets implémentant Traversable via l’instruction for . Exemple simple : {% for produit in produits %} {{ produit.nom }}<br /> {% endfor %} Avec clé et valeur : {% for cle, valeur in tableau %} {{ cle }} : {{ valeur }}<br /> {% endfor %} Gestion des tableaux vides : {% for item in liste %} {{ item }}<br /> {% else %} Aucun élément à afficher. {% endfor %} Attributs spéciaux dans les boucles : loop.index : Index de l’itération (commence à 1). loop.first : true pour la première itération. loop.last : true pour la dernière itération. Les balises Twig (tags) Les tags sont des instructions avancées de Twig, utilisées pour définir des variables, inclure des templates, ou contrôler l’échappement des données. a) Créer des variables avec set {% set titre = 'Page d\'accueil' %} {% set tableau = [1, 2, 3] %} {% set tableau_associatif = {'clé': 'valeur'} %} b) Échappement des données Twig échappe automatiquement les variables pour éviter les injections de code. Exemple : {% set titre = '<h1>Page sécurisée</h1>' %} {{ titre }} {# Affichera les balises comme texte #} Pour désactiver cet échappement : {{ titre|raw }} Inclure des templates Twig permet de factoriser du contenu répétitif en utilisant l’inclusion de templates. Exemple d’inclusion : {{ include('header.html.twig') }} Vous pouvez aussi transmettre des variables spécifiques : {{ include('header.html.twig', {'titre': 'Mon Site'}) }} Pour restreindre l’accès au contexte du template appelant : {{ include('header.html.twig', with_context = false) }} Rendu conditionnel avec des filtres Twig permet d’ajouter des filtres pour transformer les données avant leur affichage. Exemple de filtres : {{ texte|upper }} {# Convertir en majuscules #} {{ montant|number_format(2, ',', ' ') }} {# Format numérique #} Documentation Twig officielle Cheatsheet Twig Documentation Symfony sur les templates Le langage Twig offre une syntaxe puissante et intuitive pour structurer et enrichir les vues de vos applications Symfony. Grâce à ses fonctionnalités avancées comme les boucles, les conditions, les tags, et les inclusions, il permet de créer des interfaces web dynamiques tout en respectant les principes de sécurité et de maintenabilité.
par admin4460
Symfony
DéveloppementSystèmes & Réseaux Tests, Sécurité et CI/CDTests, Sécurité et CI/CDCet article présente une stratégie pour assurer la qualité, la sécurité et le déploiement continu d'une application basée sur Laravel 11 et React 18. La stratégie s'articule autour de quatre piliers fondamentaux : Tests complets et modernes : Une approche... 📍 Voir Plus ... DéveloppementSystèmes & Réseaux Déploiement étape par étape d’une application web sur O2SwitchDéploiement étape par étape d’une application web sur O2SwitchJe vais vous expliquer de façon détaillée comment déployer votre application développée localement (Laravel 11 + React 19 + Axios + MySQL + Bootstrap) sur un hébergement O2Switch. Suivez ces étapes dans l'ordre pour un déploiement réussi. Étape 1: Préparation de... 📍 Voir Plus ... DéveloppementSystèmes & Réseaux Déploiement et Maintenance d’Application WebDéploiement et Maintenance d’Application WebLe processus de mise en production et les mesures de suivi/maintenance pour notre application web (Laravel 11 en backend / React 19 en frontend, avec Axios, Bootstrap, base MySQL, hébergement O2Switch). L’objectif est de garantir un déploiement fluide, sécurisé et... 📍 Voir Plus ... 📍 VOIR PLUS ... 📍 Apple Bureautique CMS Cybersécurité Data Design Développement Angular HTML et CSS Java JavaScript Laravel Bug PHP React JS SQL Symfony E-commerce Gestion de projet L’intelligence artificielle Linux LMS Management Référencement Optimisation Marketing & Communication News et actualité DIGI Pédagogie & Formation Systèmes & Réseaux Windows
© MyCreaNet 2025 Mentions légales Plan du site Gestion des cookies Accessibilité Nom d'utilisateur Mot de passe Mot de passe oublié? Se connecter SuivreSuivreSuivreSuivreSuivre window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-L58BSN4YKD');
{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/wp-*.php","\/wp-admin\/*","\/wp-content\/uploads\/*","\/wp-content\/*","\/wp-content\/plugins\/*","\/wp-content\/themes\/Divi\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} .et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] .et-code-snippets-library-btns-wrap:before, .et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] .et-code-buttons-wrapper:before { content: "\45"; font-size: 27px; color: #ccffcc; font-family: ETModules; cursor: pointer; width: 28px; height: 27px; border-radius: 3px; padding-top: 1px; background-color: rgb(255, 255, 255, 0.2) !important; } .et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] .et-fb-form__group:nth-of-type(4) { display: none; } jQuery(document).ready(function($) { $(document).on('click', '.et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] .et-code-snippets-library-btns-wrap, .et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] .et-code-buttons-wrapper', function(event) { if (event.target !== event.currentTarget) { return; // Exit the function if the click is on a child element } var firstEditor = $('.et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] .CodeMirror').get(0)?.CodeMirror; if (!firstEditor) { return; } $('.et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] textarea[name="code_to_render"]').click(); // Enable hidden codemirror var secondEditor = $('.et-fb-form__toggle[data-name="et_pb_db_php_code_main_content"] .CodeMirror').get(1)?.CodeMirror; if (!secondEditor) { return; } var content = firstEditor.getValue(); // Add a random nonce as the first line of content to prevent caching var nonce = Math.random().toString(36).substring(2, 15); content = '/* nonce:' + nonce + ' */\n' + content; secondEditor.setValue(content); }); }); (function() { var file = ["https:\/\/mycreanet.fr\/wp-content\/et-cache\/4956\/et-divi-dynamic-tb-6374-tb-469-tb-6415-4956-late.css"]; var handle = document.getElementById('divi-style-inline-inline-css'); var location = handle.parentNode; if (0===document.querySelectorAll('link[href="' + file + '"]').length) { var link = document.createElement('link'); link.rel = 'stylesheet'; link.id = 'et-dynamic-late-css'; link.href = file; location.insertBefore(link, handle.nextSibling); } })(); var et_link_options_data = [{"class":"et_pb_row_0_tb_body","url":"https:\/\/mycreanet.fr\/contact\/","target":"_self"}]; /* <![CDATA[ */ var tocplus = {"smooth_scroll":"1","visibility_show":"Afficher","visibility_hide":"Masquer","width":"Auto"}; /* ]]> */ /* <![CDATA[ */ var DIVI = {"item_count":"%d Item","items_count":"%d Items"}; var et_builder_utils_params = {"condition":{"diviTheme":true,"extraTheme":false},"scrollLocations":["app","top"],"builderScrollLocations":{"desktop":"app","tablet":"app","phone":"app"},"onloadScrollLocation":"app","builderType":"fe"}; var et_frontend_scripts = {"builderCssContainerPrefix":"#et-boc","builderCssLayoutPrefix":"#et-boc .et-l"}; var et_pb_custom = {"ajaxurl":"https:\/\/mycreanet.fr\/wp-admin\/admin-ajax.php","images_uri":"https:\/\/mycreanet.fr\/wp-content\/themes\/Divi\/images","builder_images_uri":"https:\/\/mycreanet.fr\/wp-content\/themes\/Divi\/includes\/builder\/images","et_frontend_nonce":"db7481e162","subscription_failed":"Veuillez v\u00e9rifier les champs ci-dessous pour vous assurer que vous avez entr\u00e9 les informations correctes.","et_ab_log_nonce":"f80146b76c","fill_message":"S'il vous pla\u00eet, remplissez les champs suivants:","contact_error_message":"Veuillez corriger les erreurs suivantes :","invalid":"E-mail non valide","captcha":"Captcha","prev":"Pr\u00e9c\u00e9dent","previous":"Pr\u00e9c\u00e9dente","next":"Prochaine","wrong_captcha":"Vous avez entr\u00e9 le mauvais num\u00e9ro dans le captcha.","wrong_checkbox":"Case \u00e0 cocher","ignore_waypoints":"no","is_divi_theme_used":"1","widget_search_selector":".widget_search","ab_tests":[],"is_ab_testing_active":"","page_id":"4956","unique_test_id":"","ab_bounce_rate":"5","is_cache_plugin_active":"no","is_shortcode_tracking":"","tinymce_uri":"https:\/\/mycreanet.fr\/wp-content\/themes\/Divi\/includes\/builder\/frontend-builder\/assets\/vendors","accent_color":"#006666","waypoints_options":[]}; var et_pb_box_shadow_elements = []; /* ]]> */ /* <![CDATA[ */ var DiviBlogExtrasFrontendData = {"ajaxurl":"https:\/\/mycreanet.fr\/wp-admin\/admin-ajax.php","ajax_nonce":"e33712ddee","et_theme_accent_color":"#006666"}; /* ]]> */ /* <![CDATA[ */ var mejsL10n = {"language":"fr","strings":{"mejs.download-file":"T\u00e9l\u00e9charger le fichier","mejs.install-flash":"Vous utilisez un navigateur qui n\u2019a pas le lecteur Flash activ\u00e9 ou install\u00e9. Veuillez activer votre extension Flash ou t\u00e9l\u00e9charger la derni\u00e8re version \u00e0 partir de cette adresse\u00a0: https:\/\/get.adobe.com\/flashplayer\/","mejs.fullscreen":"Plein \u00e9cran","mejs.play":"Lecture","mejs.pause":"Pause","mejs.time-slider":"Curseur de temps","mejs.time-help-text":"Utilisez les fl\u00e8ches droite\/gauche pour avancer d\u2019une seconde, haut\/bas pour avancer de dix secondes.","mejs.live-broadcast":"\u00c9mission en direct","mejs.volume-help-text":"Utilisez les fl\u00e8ches haut\/bas pour augmenter ou diminuer le volume.","mejs.unmute":"R\u00e9activer le son","mejs.mute":"Muet","mejs.volume-slider":"Curseur de volume","mejs.video-player":"Lecteur vid\u00e9o","mejs.audio-player":"Lecteur audio","mejs.captions-subtitles":"L\u00e9gendes\/Sous-titres","mejs.captions-chapters":"Chapitres","mejs.none":"Aucun","mejs.afrikaans":"Afrikaans","mejs.albanian":"Albanais","mejs.arabic":"Arabe","mejs.belarusian":"Bi\u00e9lorusse","mejs.bulgarian":"Bulgare","mejs.catalan":"Catalan","mejs.chinese":"Chinois","mejs.chinese-simplified":"Chinois (simplifi\u00e9)","mejs.chinese-traditional":"Chinois (traditionnel)","mejs.croatian":"Croate","mejs.czech":"Tch\u00e8que","mejs.danish":"Danois","mejs.dutch":"N\u00e9erlandais","mejs.english":"Anglais","mejs.estonian":"Estonien","mejs.filipino":"Filipino","mejs.finnish":"Finnois","mejs.french":"Fran\u00e7ais","mejs.galician":"Galicien","mejs.german":"Allemand","mejs.greek":"Grec","mejs.haitian-creole":"Cr\u00e9ole ha\u00eftien","mejs.hebrew":"H\u00e9breu","mejs.hindi":"Hindi","mejs.hungarian":"Hongrois","mejs.icelandic":"Islandais","mejs.indonesian":"Indon\u00e9sien","mejs.irish":"Irlandais","mejs.italian":"Italien","mejs.japanese":"Japonais","mejs.korean":"Cor\u00e9en","mejs.latvian":"Letton","mejs.lithuanian":"Lituanien","mejs.macedonian":"Mac\u00e9donien","mejs.malay":"Malais","mejs.maltese":"Maltais","mejs.norwegian":"Norv\u00e9gien","mejs.persian":"Perse","mejs.polish":"Polonais","mejs.portuguese":"Portugais","mejs.romanian":"Roumain","mejs.russian":"Russe","mejs.serbian":"Serbe","mejs.slovak":"Slovaque","mejs.slovenian":"Slov\u00e9nien","mejs.spanish":"Espagnol","mejs.swahili":"Swahili","mejs.swedish":"Su\u00e9dois","mejs.tagalog":"Tagalog","mejs.thai":"Thai","mejs.turkish":"Turc","mejs.ukrainian":"Ukrainien","mejs.vietnamese":"Vietnamien","mejs.welsh":"Ga\u00e9lique","mejs.yiddish":"Yiddish"}}; /* ]]> */ /* <![CDATA[ */ var _wpmejsSettings = {"pluginPath":"\/wp-includes\/js\/mediaelement\/","classPrefix":"mejs-","stretching":"responsive","audioShortcodeLibrary":"mediaelement","videoShortcodeLibrary":"mediaelement"}; /* ]]> */ .wptpa_song_infrmtn, .wptpa_currenttime, .wptpa_duration, .wptpa_song, .wptpa_dwn_cnt, .wptpa_play_cnt, .wptpa_num, .wptpa_h2, .wptpa_ads{ font-family: 'Roboto', sans-serif; } .wptpa_player { background: #FFFFFF !important; } .wptpa_heading:before, .wptpa_heading:after { background: #000000 !important; } .wptpa_song_infrmtn { color: #000000 !important; } .wptpa_btn .wptpa_icon { fill: #555555; } .wptpa_btn.actv .wptpa_icon, .wptpa_btn:hover .wptpa_icon{ fill: #00D084; } .wptpa_btn:before{ background: #555555 !important; } .wptpa_player .wptpa_seek, .wptpa_player .wptpa_loader { background: #FFDA48 !important; } .wptpa_player .wptpa_seek span, .wptpa_progress { background: #CF2E2E !important; } .wptpa_ads, .wptpa_currenttime, .wptpa_duration { color: #FFFFFF !important; } .wptpa_volume_seek:before { background: #FFDA48 !important; } .wptpa_volume_value { background: #CF2E2E !important; } .wptpa_pllst_itm { border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important; background: #23C5A3 !important; color: #000000 !important; } .wptpa_pllst_itm.crrnt, .wptpa_pllst_itm:hover { background: #FFDA48 !important; color: #000000 !important; } .wptpa_pllst_itm:last-child { border-bottom: 0px solid rgba(255, 255, 255, 0.25) !important; } .wptpa_bars, .wptpa_bars:before, .wptpa_bars:after{ background: #000000 !important; } .wptpa_line { border-color: #000000 !important; } .wptpa_pllst_itm .wptpa_icon { fill: #000000; } .wptpa_dwn_cnt, .wptpa_play_cnt { color: #000000 !important; } .wptpa_scroll_bar { background: #000000 !important; }