17-5 Utilisation du FormBuilder

Pour simplifier la création de formulaires, Angular propose le FormBuilder qui permets de réduire la quantité de code à écrire et d'instances de FormControl à créer manuellement.

Pour utiliser le FormBuilder, plutôt que d'instancier un FormGroup et des FormControl par la suite, on peut simplifier de cette façon:

src/app/features/projets/pages/projet-creer.ts

export class ProjetCreer {
  projetForm = new FormBuilder().group({
    nom: ['', [Validators.required, Validators.minLength(3)]],
    description: [''],
  }, {
    updateOn : 'blur'
  });

//...

info

• projetForm = new FormBuilder().group: plutôt que d'instancier manuellement un FormGroup, on utilise group() sur une nouvelle instance de FormBuilder.
• Pour les FormControl, plutôt que d'instancier un FormControl pour chaque champ, on ne fait que spécifier sa propriété (ex.: nom) et ensuite on passe un tableau contenant les différents arguments (valeur par défaut du champ et la liste des Validators.)