Temps de lecture : 24 minutes environ.
Maintenant que nous avons vu comment créer les entités, les contrôleurs et les vues, il est temps de connecter tous ces éléments.
Dans cet exemple, nous allons commencer à créer la page qui affichera tous les articles.
Ils seront triés du plus récent au plus ancien et affichés sur la route "/actualites"
Nous devrons suivre plusieurs étapes :
- Identifier ou créer le contrôleur
- Identifier l'entité qui nous permettra d'accéder aux données
- Identifier ou créer la vue qui permettra d'afficher la liste des articles
Le contrôleur
Nous allons rassembler toutes les fonctionnalités liées aux articles dans un contrôleur unique qui n'existe pas encore et qui s'appellera "ArticlesController"
Créer le contrôleur
Afin de créer le contrôleur, nous allons utiliser la commande vue précédemment
php bin/console make:controller
A la question du nom, nous entrons "ArticlesController".
Le fichier "ArticlesController.php" est créé et contient le code suivant
<?php
namespace App\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Routing\Annotation\Route;
class ArticlesController extends AbstractController
{
/**
* @Route("/articles", name="articles")
*/
public function index()
{
return $this->render('articles/index.html.twig', [
'controller_name' => 'ArticlesController',
]);
}
}
Il contient une seule méthode appelée "index" et correspondant à la route "/articles"
Modifier le contrôleur
Nous allons modifier ce contrôleur pour qu'il corresponde à ce que nous souhaitons faire, accéder par la route "/actualites".
Par extension, toutes les routes concernant les articles seront accessibles par une route commençant par "/actualites".
Les annotations nous permettent de configurer ce comportement et de donner un préfixe de route pour toutes les méthodes de notre contrôleur.
Cette annotation est à inclure juste au dessus de la déclaration de classe comme ceci
// lignes 1 à 6
/**
* Class ArticlesController
* @package App\Controller
* @Route("/actualites", name="actualites_")
*/
class ArticlesController extends AbstractController
{
Cette annotation effectue deux choses. Elle définit le préfixe "/actualites" et un préfixe de nom de route "actualites_".
Nous allons adapter l'annotation de la méthode "index" afin qu'elle prenne en compte ce préfixe, elle sera comme ceci
/**
* @Route("/", name="articles")
*/
public function index()
{
La route devient "/" afin de prendre en compte le préfixe.
Accéder aux données
Nous allons accéder à la base de données pour y récupérer la liste des articles.
Lors de la création de notre entité "Articles", un fichier appelé "ArticlesRepository.php" a été créé dans le dossier "src/Repository". Ce fichier permet d'accéder aux données de la table "articles" de la base de données par l'intermédiaire de 4 méthodes pré existantes ou toute méthode personnalisée que nous pourrions créer.
Les 4 méthodes pré existantes sont :
- find : qui permet de trouver un enregistrement depuis son id
- findOneBy : permet de trouver un enregistrement en indiquant des critères
- findAll : retourne tous les enregistrements
- findBy : permet de trouver plusieurs enregistrements en indiquant des critères
Afin d'accéder à tous nos articles mais triés du plus récent au plus ancien, nous allons utiliser la méthode "findBy".
Pour ce faire, nous utiliserons une syntaxe basée sur l'ORM "Doctrine", un système qui permet d'accéder à la base de données sans se soucier des requêtes. Nous l'avons déjà utilisé lors de la création des entités et des migrations.
Doctrine permet d'accéder au fichier "Repository" et d'exécuter les méthodes qu'il contient pour récupérer les données.
Pour accéder à la liste de nos articles, nous utiliserons la ligne suivante
// Méthode findBy qui permet de récupérer les données avec des critères de filtre et de tri
$articles = $this->getDoctrine()->getRepository(Articles::class)->findBy([],['created_at' => 'desc']);
La méthode "findBy" accepte plusieurs paramètres :
- Un tableau (ici vide) permettant de préciser les critères de filtre (équivalent WHERE en SQL)
- Un tableau, optionnel, contenant les critères de tri (équivalent ORDER BY en SQL), ici un tri décroissant sur "created_at"
- Une valeur, optionnelle, permettant de limiter le nombre de résultats (équivalent LIMIT en SQL)
- Une valeur, optionnelle, permettant de déterminer le 1er résultat (équivalent OFFSET en SQL)
Nous utilisons dans notre exemple la classe "Articles", il sera nécessaire de l'appeler par l'ajout de la ligne
use App\Entity\Articles;
Notre contrôleur ressemble maintenant à ceci
<?php
namespace App\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Routing\Annotation\Route;
use App\Entity\Articles;
/**
* Class ArticlesController
* @package App\Controller
* @Route("/actualites", name="actualites_")
*/
class ArticlesController extends AbstractController
{
/**
* @Route("/", name="articles")
*/
public function index()
{
// Méthode findBy qui permet de récupérer les données avec des critères de filtre et de tri
$articles = $this->getDoctrine()->getRepository(Articles::class)->findBy([],['created_at' => 'desc']);
return $this->render('articles/index.html.twig', [
'controller_name' => 'ArticlesController',
]);
}
}
Envoyer les données à la vue
Les données ayant été extraites de la base de données, il faut maintenant les envoyer à la vue.
Ceci s'effectuera dans la méthode "render" qui accepte un tableau en paramètre qui contiendra les données à envoyer.
Nous allons modifier cette ligne comme ceci
return $this->render('articles/index.html.twig', [
'articles' => $articles,
]);
A noter que le tableau peut prendre une structure plus compacte au moyen de la fonction compact de php.
return $this->render('articles/index.html.twig', compact('articles'));
Afficher les données
Il nous reste maintenant à afficher les données dans notre vue.
Nous avons envoyé la liste des articles sous le nom "articles", nous pourrons donc y accéder sous ce nom dans notre dichier "Twig".
Le contrôleur fait appel au fichier "index.html.twig" situé dans "templates/articles". Nous allons donc modifier ce fichier pour qu'il affiche nos articles.
Ces articles sont envoyés sous forme d'un tableau qu'il va falloir parcourir.
Pour ce faire, nous allons faire une boucle sur le tableau. En php, il suffirait d'utiliser le foreach, mais nous sommes dans un fichier twig, le php n'est pas utilisable.
Heureusement, nous avons accès aux boucles dans les fichiers twig au moyen du "for..in"
Nous bouclerons donc sur notre variable "articles" de cette façon
{# nous bouclons sur articles. A l'intérieur de la boucle, nous utiliserons la variable article #}
{% for article in articles %}
{# Contenu de la boucle #}
{% endfor %}
Si nous souhaitons afficher une variable, nous utiliserons cette syntaxe
{{ variable }}
Si il s'agit d'un tableau, nous utiliserons cette syntaxe
{{ tableau.index }}
De ce fait, notre fichier twig sera le suivant
{% extends 'base.html.twig' %}
{% block title %}Liste des articles{% endblock %}
{% block body %}
<h1>Liste des articles</h1>
{% for article in articles %}
<h2>{{ article.titre }}</h2>
<div>{{ article.contenu }}</div>
{% endfor %}
{% endblock %}
Et voilà, la liste des articles est maintenant accessible.
Dans un prochain article nous verrons comment créer les liens entre les différentes pages.
Obtenir de l'aide
Pour obtenir de l'aide, vous pouvez accéder au serveur Discord pour une entraide par chat
