4.1#Template Driven Form

Dans cette vidéo je vous présente l'approche Template Driven Forms .

Template Driven Forms: le formulaire ainsi que les validateurs sont crées directement au niveau du Template et Angular l'analyse pour comprendre les différents inputs et pour en mettre à disposition le contenu.
Les étapes pour implémenter un formulaire en utilisant le Template Driven Form:
***********étape 0: Au niveau du module racine app Module, importer le module
*********** étape 1: Création du Formulaire
a. Créer le composants et développer le formulaire d'inscription.
b. Créer une classe pour le modèle utilisateur.
c. Utiliser les directives:
ngModel: La directive NgModel assure le two-way DataBinding. En l’utilisant dans un formulaire, cette directive permet de suivre l’état de chaque FormControl auquel elle est associée.

ngForm: La directive NgForm complète le formulaire avec des fonctionnalités supplémentaires. En effet, cette directive surveille les propriétés de tout le formulaire

*********** étape 2: Validation de formulaire

a. Ajouter la validation à l'aide de validateurs intégrés. Plusieurs contraintes peuvent être attachés à un élément dans le formulaire:
Les attributs HTML de validation : required, minlength, maxlength, min, max, pattern, …
Des validateurs personnalisés: pattern

b. Afficher les erreurs de validation de manière significative. Un élément est valide si la contrainte attachée est respectée

*********** étape 3: Soumission du Formulaire
Gérer la soumission du formulaire à l'aide de ngSubmit