Dynamisation d'un Composant Statique
Objectifs
Les objectifs de cette vidéo sont de comprendre comment utiliser le décorateur Input pour dynamiser les composants Angular et d'apprendre à utiliser la directive NG4 pour générer des composants en boucle.
Résumé
Apprenez comment dynamiser un composant statique avec Angular en utilisant le décorateur Input et la directive NG4.
Description
Dans cette leçon, nous allons apprendre comment transformer un composant statique en un composant dynamique en utilisant Angular. La première étape consiste à déclarer une variable dans le fichier TypeScript du composant et à utiliser le décorateur Input. Cette variable peut ensuite être initialisée à partir d'un élément externe qui appelle le composant. Ensuite, nous remplacerons le contenu statique de notre fichier HTML par cette variable.
Ensuite, nous allons travailler sur une page de liste d'annonces. Nous allons déclarer une liste d'annonces dans le fichier TypeScript et utiliser la directive Angular NG4 pour générer automatiquement le composant pour chaque annonce de la liste. Enfin, nous passerons chaque annonce en paramètre au composant afin de les afficher dynamiquement. Ainsi, toute modification de la liste d'annonces se reflétera automatiquement dans la vue, rendant notre composant totalement dynamique.
Ce processus se conclut par la vérification de l'affichage correct des annonces. Cette leçon pave la voie pour la leçon suivante où nous aborderons les services dans Angular.