Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

Introduzione a Twig

Twig è il template engine creato dagli stessi sviluppatori del framework PHP Symfony che permette di gestire facilmente i template di progetti multipagina.
Twig è il template engine creato dagli stessi sviluppatori del framework PHP Symfony che permette di gestire facilmente i template di progetti multipagina.
Link copiato negli appunti

La scelta di come gestire i template su Symfony è a discrezione dell'utente. Non siamo obbligati quindi ad avere un template engine ma volendo potremmo anche gestire le nostre pagine manualmente.

È chiaro però che quando si ha a che fare con molte pagine diventa piuttosto macchinoso non avere un template engine che ci supporti. Gli stessi creatori di Symfony hanno risolto il problema alla radice rilasciando Twig che viene rilasciato come libreria a sé stante, il che vuol dire che può essere integrata all'interno di qualsiasi applicazione indipendentemente dall'utilizzo del framework PHP.

Vediamo alcune caratteristiche che rendono Twig uno strumento molto potente:

  • la sintassi è semplicissima e si riesce a essere operativi in pochissimo tempo.
  • Template oriented: contiene scorciatoie per gestire i casi d'uso più comuni con meno righe di codice rispetto allo gestire i template con PHP puro.
  • Ereditarietà: il sistema di override dei template consente di estendere quelli base e adattarli al contesto in maniera molto semplice senza dover duplicare codice.
  • Estendibile: se gli strumenti messi a disposizione non dovrebbero essere sufficienti è possibile estendere la libreria in maniera del tutto immediata.

Lo scopo di questa lezione non è quello di trattare la libreria in maniera esauriente ma solo di introdurne le caratteristiche principali. Durante la guida esporremo altri concetti appena ne avremo la necessità.

La sintassi

Twig racchiude la sua sintassi all'interno di due tipologie principali di costrutto:

  • Variabili o espressioni: {{ name }}.
  • Tags: {% if name = 'Simone' %}ciao Simone{% endif %}.

Qualsiasi cosa contenuta all'interno di due parentesi graffe viene prima elaborata e poi stampata a schermo, possiamo considerarlo l'equivalente di <?php echo $name ?>.

Se un'espressione si trova all'interno di una parentesi graffa e di un simbolo di percentuale è considerata invece un tag e viene utilizzata per gestire la logica della vista. L'equivalente, ad esempio, di <?php if ($name == 'Simone) { echo "ciao Simone"; }.

Variabili

L'accesso alle variabili del template è molto semplice e con la medesima sintassi riusciamo a gestire diversi casi d'uso. Per passare delle variabili a un template dobbiamo innanzitutto valorizzarle all'interno del controller. Se riprendiamo il controller creato nella precedente lezione all'interno del metodo render() possiamo passare un secondo parametro con un array di variabili che verranno “iniettate” nel template:

return $this->render('home/index.html.twig', [
  'greeting' => 'Good morning',
  'user' => [
    'firstName' => 'Simone',
    'lastName' => 'D\'Amico',
  ]
]);

In questo modo, all'interno del template app/templates/home/index.html.twig possiamo accedere alle variabili in questo modo:

{{ greeting }}, {{ user.firstName}} {{ user.lastName}}

Aprendo la pagina otterremo:

Good morning, Simone D'Amico

Come abbiamo notato, attraverso il . possiamo accedere alle chiavi di un array. In realtà nello stesso modo possiamo anche accedere alle proprietà di un oggetto. Twig infatti è capace di determinare il tipo della variabile e in caso di oggetto cerca all'interno di esso nell'ordine:

  • $user->firstName: una proprietà pubblica;
  • $user->firstName(): un metodo con il nome della chiave;
  • $user->getFirstName(): un metodo getter;
  • $user->isFirstName(): un metodo is.

Questa è sicuramente una delle scorciatoie più comode che permettono di risparmiare codice durante lo sviluppo.

Le doppie parentesi graffe oltre a stampare il contenuto di una variabile possono anche valutare un'espressione prima di stamparne il risultato:

{{ user.firstName == 'Simone' ? 'admin' : 'user' }}

Le variabili possono anche essere dichiarate direttamente all'interno del template:

{% set fullName = user.firstName ~ ' ' ~ user.lastName %}

L'operatore ~ è usato per concatenare stringhe. Il costrutto appena visto non produce alcun output ma dichiara una variabile fullName che sarà la concatenazione di nome e cognome dell'utente.

Logiche di controllo

È abbastanza comune all'interno di un template dover verificare delle condizioni oppure ciclare degli elementi. Vediamo insieme come Twig ci consente di effettuare queste operazioni:

IF

{% if role = 'admin' %}
  <h1>Sei un amministratore</h1>
{% elseif role = 'editor' %}
  <h1>Sei un editor</h1>
{% else %}
  <h1>Sei un utente normale</h1>
{% endif %}

FOR

Supponiamo di avere un array di utenti $users che vengono passati alla vista, possiamo ciclarli attraverso il costrutto for in questo modo:

{% for user in users %}
  {{ loop.index }} - {{ user.firstName }}
{% else %}
  Nessun utente trovato
{% endfor %}

Possiamo notare che ci sono due elementi di semplificazione rispetto al gestire i template nativamente con PHP:

  • il ciclo for fornisce un ramo else con cui gestire automaticamente il caso in cui l'array da ciclare sia vuoto.
  • Il ciclo for introduce anche una variabile interna loop che contiene al suo interno diverse informazioni interessanti:

    • loop.index l'indice corrente dell'array (1-based).
    • loop.index0 l'indice corrente dell'array (0-based).
    • loop.revindex l'indice corrente rispetto alla fine dell'array (1-based).
    • loop.revindex0 l'indice corrente rispetto alla fine dell'array (0-based).
    • loop.first è true se è il primo elemento dell'array.
    • loop.last è true se è il secondo elemento dell'array.
    • loop.length contiene la lunghezza della sequenza.
    • loop.parent accede al contesto del parent, in caso di loop annidati.

Ci sono altre caratteristiche importanti del for che approfondiremo più avanti, per adesso vediamone un'ultima molto utile per iterare all'interno di sequenze:

{% for index in 0..100 %}
{% for index in 'a'..'z' %}

Automaticamente il template engine creerà una sequenza dall'indice di partenza a quello di arrivo senza dover definire ulteriori variabili.

Ti consigliamo anche