1 00:00:03,890 --> 00:00:09,395 Nous venons d'apprendre sur le support Angular pour les formulaires, 2 00:00:09,395 --> 00:00:12,125 et en particulier, la forme pilotée par les modèles. 3 00:00:12,125 --> 00:00:17,520 Dans cet exercice, nous allons créer un formulaire basé sur un modèle, puis inclure ce 4 00:00:17,520 --> 00:00:23,375 dans notre dialogue de composant de connexion que nous avons créé dans l'exercice précédent. 5 00:00:23,375 --> 00:00:29,580 Dans cette conférence, le formulaire basé sur le modèle que nous créons, 6 00:00:29,580 --> 00:00:34,850 permet à l'utilisateur de taper son nom d'utilisateur et son mot de passe dans le formulaire de connexion, 7 00:00:34,850 --> 00:00:37,700 et ensuite soumettre cette information à notre application. 8 00:00:37,700 --> 00:00:41,825 Maintenant, comment ces informations sont traitées par le côté serveur, 9 00:00:41,825 --> 00:00:44,990 qui est laissé à un cours ultérieur. 10 00:00:44,990 --> 00:00:49,310 Mais pour le moment, nous avons un moyen de capturer le nom d'utilisateur et le mot de passe 11 00:00:49,310 --> 00:00:54,285 soumis par l'utilisateur via le formulaire basé sur le modèle de connexion, 12 00:00:54,285 --> 00:00:58,210 que nous allons concevoir dans cet exercice. 13 00:00:58,210 --> 00:01:01,115 En procédant à l'exercice, 14 00:01:01,115 --> 00:01:05,030 la première étape pour pouvoir tirer parti de l'utilisation 15 00:01:05,030 --> 00:01:08,890 des formulaires pilotés par modèle est d'aller dans le fichier app module.ts 16 00:01:08,890 --> 00:01:17,140 , puis d'importer quelques modules de support pour notre application. 17 00:01:17,140 --> 00:01:20,764 Donc, la première chose que je vais importer est 18 00:01:20,764 --> 00:01:33,155 le MatFormFieldModule du champ de formulaire matériel Angular 19 00:01:33,155 --> 00:01:38,085 . 20 00:01:38,085 --> 00:01:44,600 Ainsi, cela nous permet de regrouper un tas d'éléments dans un champ de formulaire là-bas. 21 00:01:44,600 --> 00:01:52,190 Ensuite, nous importerons également le MatinputModule. 22 00:01:52,190 --> 00:01:58,100 Le module d'entrée prend en charge le composant d'entrée qui est 23 00:01:58,100 --> 00:02:03,650 un composant de matériau angulaire stylisé 24 00:02:03,650 --> 00:02:09,690 qui prend en charge le champ de formulaire d'entrée à partir de formulaires HTML ici. 25 00:02:09,690 --> 00:02:15,520 Ensuite, aussi, permettez-moi d'importer un MatCheckBox, 26 00:02:18,680 --> 00:02:29,895 le module correspondant de la case à cocher Angular Material. 27 00:02:29,895 --> 00:02:32,690 Donc, ces trois prennent en charge 28 00:02:32,690 --> 00:02:36,410 trois éléments de formulaire que nous allons utiliser lors de la création de notre application. 29 00:02:36,410 --> 00:02:42,420 Le module champ de formulaire nous permet de regrouper un tas d'éléments de formulaire. 30 00:02:42,420 --> 00:02:46,240 Le module d'entrée nous permet de créer un champ d'entrée là-dedans. 31 00:02:46,240 --> 00:02:48,460 Le module de case à cocher, comme vous pouvez vous y attendre, 32 00:02:48,460 --> 00:02:50,570 nous permet de créer une case à cocher. 33 00:02:50,570 --> 00:02:53,670 De plus, j'ai également besoin d'importer 34 00:02:53,670 --> 00:03:06,190 le FormsModule à partir de formes angulaires. 35 00:03:06,190 --> 00:03:10,130 Le FormsModule est celui qui prend en charge les formulaires dans Angular. 36 00:03:10,130 --> 00:03:12,445 C'est celui qui prend en charge les formulaires pilotés par modèle. 37 00:03:12,445 --> 00:03:15,280 Donc, maintenant que nous avons importé ces, évidemment, 38 00:03:15,280 --> 00:03:23,775 , l'étape suivante est d'aller dans le décorateur NgModule et ensuite de les mettre en place ici. 39 00:03:23,775 --> 00:03:30,560 Donc, nous allons entrer ici et ensuite entrer le FormsModule. 40 00:03:30,660 --> 00:03:38,200 Laissez-moi entrer le FormFieldModule, 41 00:03:38,200 --> 00:03:45,075 le InputModule, le CheckBoxModule ici. 42 00:03:45,075 --> 00:03:49,325 Ensuite, maintenant mon module d'application est prêt 43 00:03:49,325 --> 00:03:55,125 pour prendre en charge l'utilisation de formulaires basés sur des modèles dans notre application. 44 00:03:55,125 --> 00:03:57,485 Maintenant que nous avons terminé cela, 45 00:03:57,485 --> 00:03:59,530 passons au composant login. 46 00:03:59,530 --> 00:04:02,320 Une grande partie de notre travail est dans le composant login. 47 00:04:02,320 --> 00:04:04,090 Laissez-moi d'abord concevoir le formulaire. 48 00:04:04,090 --> 00:04:07,975 Donc, en allant dans le fichier de modèle de composant de connexion, 49 00:04:07,975 --> 00:04:14,345 laissez-moi ajouter dans le modèle pour notre formulaire pour créer le formulaire ici. 50 00:04:14,345 --> 00:04:16,190 Donc, en haut, 51 00:04:16,190 --> 00:04:25,940 , je vais créer un p 52 00:04:25,940 --> 00:04:30,715 qui affichera les informations que j'ai tapées dans le formulaire. 53 00:04:30,715 --> 00:04:36,750 Dans le code, nous aurons une variable JavaScript appelée user, 54 00:04:36,750 --> 00:04:41,175 qui sera liée aux champs de ce formulaire. 55 00:04:41,175 --> 00:04:42,500 Maintenant, quand nous créerons cela, 56 00:04:42,500 --> 00:04:43,690 deviendra plus clair. 57 00:04:43,690 --> 00:04:45,490 Maintenant, ici, en incluant ceci, 58 00:04:45,490 --> 00:04:50,100 ce que j'autorise est de montrer les changements. 59 00:04:50,100 --> 00:04:52,990 Comme nous tapons des informations dans le formulaire, 60 00:04:52,990 --> 00:04:56,390 les changements correspondants qui se produisent dans le code à 61 00:04:56,390 --> 00:05:00,880 reflètent l'état du formulaire peuvent être affichés juste là. 62 00:05:00,880 --> 00:05:04,500 Maintenant, en plus, maintenant je vais créer le formulaire ici. 63 00:05:04,500 --> 00:05:07,210 Donc, nous allons entrer et ajouter l'élément de formulaire ici. 64 00:05:07,210 --> 00:05:09,470 Pour cet élément de formulaire, 65 00:05:09,470 --> 00:05:11,000 Je vais appliquer 66 00:05:11,000 --> 00:05:15,260 l'attribut novalidate ici parce que 67 00:05:15,260 --> 00:05:19,625 nous voulons que la validation du formulaire soit prise en charge par Angular et non 68 00:05:19,625 --> 00:05:28,820 par la validation du formulaire HTML standard 69 00:05:28,820 --> 00:05:30,230 ce support du navigateur. 70 00:05:30,230 --> 00:05:38,810 Donc, nous allons transférer cette responsabilité dans notre application Angular elle-même. 71 00:05:38,810 --> 00:05:44,800 Donc, c'est pourquoi je spécifie l'attribut novalidate pour mon téléphone. 72 00:05:44,800 --> 00:05:47,310 Donc, cela crée mon formulaire ici. 73 00:05:47,310 --> 00:05:53,720 À l'intérieur, je vais utiliser le mat-dialog-content. 74 00:05:53,790 --> 00:05:58,360 Maintenant, le mat-dialog-content, comme vous pouvez vous y attendre, 75 00:05:58,360 --> 00:06:03,740 est une zone qui contient le contenu de la boîte de dialogue elle-même. 76 00:06:03,740 --> 00:06:06,970 Donc, c'est pourquoi nous avons mis ce mat-dialog-content ici. 77 00:06:06,970 --> 00:06:14,265 Alors, ici, je vais créer mon formulaire ici. 78 00:06:14,265 --> 00:06:16,675 Alors, j'ai mis un p là. 79 00:06:16,675 --> 00:06:23,915 A l'intérieur de ce p, je vais utiliser un mat-form-field ici. 80 00:06:23,915 --> 00:06:28,805 Donc, le mat-form-field me permet de regrouper un ensemble 81 00:06:28,805 --> 00:06:33,845 d'éléments liés au formulaire que j'utilise ensemble. 82 00:06:33,845 --> 00:06:39,765 Donc, ici, je vais mettre l'entrée ici. 83 00:06:39,765 --> 00:06:44,505 Donc, le champ de formulaire d'entrée à partir des formulaires de fichier HTML. 84 00:06:44,505 --> 00:06:50,255 Ensuite, j'appliquerai l'attribut MatinPut 85 00:06:50,255 --> 00:06:57,360 qui nous permettra d'appliquer le style de conception du matériau pour cette entrée. 86 00:06:57,360 --> 00:07:04,635 Ensuite, nous allons donner un espace réservé pour cela comme nom d'utilisateur, 87 00:07:04,635 --> 00:07:06,569 et comme vous pouvez vous y attendre, 88 00:07:06,569 --> 00:07:12,220 et le type sera de type texte ici. 89 00:07:15,140 --> 00:07:19,830 Laissez-moi ajouter dans le ngModel. 90 00:07:19,830 --> 00:07:30,000 Donc, un formulaire basé sur un modèle est pris en charge par l'attribut ngModel ici. 91 00:07:30,000 --> 00:07:31,520 Donc, avec le NGModel. 92 00:07:31,520 --> 00:07:36,130 Donc, vous pouvez voir la façon de la boîte de réception banane de déclarer cela. 93 00:07:36,130 --> 00:07:40,270 Ensuite, nous dirons user.username. 94 00:07:40,270 --> 00:07:48,345 Donc, cet utilisateur va être un objet JavaScript dans mon fichier TypeScript, 95 00:07:48,345 --> 00:07:52,440 qui contiendra une propriété de nom d'utilisateur là-bas, 96 00:07:52,440 --> 00:07:58,540 qui suivra la valeur que vous entrez dans ce champ de saisie dans mon formulaire là-bas. 97 00:07:58,540 --> 00:08:06,320 Donc, c'est pourquoi nous attachons cette information de champ de saisie dans cet objet JavaScript. 98 00:08:06,320 --> 00:08:08,890 Donc, c'est la liaison de données bidirectionnelle que nous faisons 99 00:08:08,890 --> 00:08:13,250 entre l'élément de formulaire et le code JavaScript correspondant. 100 00:08:13,250 --> 00:08:19,640 Ensuite, nous allons donner un nom comme nom d'utilisateur ici. 101 00:08:19,640 --> 00:08:24,495 Donc, c'est mes premiers champs de formulaire que j'ai ajoutés ici. 102 00:08:24,495 --> 00:08:29,330 Maintenant, de même, je vais ajouter dans le deuxième champ de formulaire pour le mot de passe. 103 00:08:29,330 --> 00:08:36,255 Donc, pour cela, laissez-moi simplement copier ceci et ensuite coller ici. 104 00:08:36,255 --> 00:08:41,820 Donc, le deuxième champ serait Input, MatinPut, 105 00:08:41,820 --> 00:08:47,760 placeholder est password, 106 00:08:47,760 --> 00:08:52,360 et ensuite le type est password. 107 00:08:52,360 --> 00:09:01,385 Donc, l'élément d'entrée de mot de passe de support de formulaire HTML5. 108 00:09:01,385 --> 00:09:11,050 Le NgModel lui-même sera lié au mot de passe de l'utilisateur et le nom sera mot de passe. 109 00:09:11,050 --> 00:09:16,335 Donc, vous voyez que l'objet JavaScript utilisateur contient maintenant deux propriétés, 110 00:09:16,335 --> 00:09:20,700 nom d'utilisateur et mot de passe, qui suivront les informations d'identification de l'utilisateur ici. 111 00:09:20,700 --> 00:09:24,995 Donc, ces deux champs de formulaire à l'intérieur de ce p ici, 112 00:09:24,995 --> 00:09:27,740 et puis aussi nous allons ajouter dans un 113 00:09:27,740 --> 00:09:35,795 plus appelé comme mat-checkbox. 114 00:09:35,795 --> 00:09:41,050 Vous avez vu que nous avions inclus le module de case à cocher plus tôt. 115 00:09:41,050 --> 00:09:43,290 Donc, nous allons ajouter ceci. 116 00:09:43,290 --> 00:09:48,735 Maintenant, cette case à cocher qui, une fois cochée, informera 117 00:09:48,735 --> 00:09:55,990 mon application Angular que le nom d'utilisateur et le mot de passe doivent être enregistrés dans l'application. 118 00:09:55,990 --> 00:10:01,220 Donc, laissez-moi lier ceci avec le modèle NG à 119 00:10:01,220 --> 00:10:09,730 une propriété correspondante appelée remember dans l'objet utilisateur. 120 00:10:09,730 --> 00:10:11,060 Donc, ce sera, 121 00:10:11,060 --> 00:10:14,020 cette propriété sera vraie ou fausse selon 122 00:10:14,020 --> 00:10:17,315 si la case est cochée ou non cochée. 123 00:10:17,315 --> 00:10:19,830 Donc, c'est comme ça que nous suivons. 124 00:10:19,830 --> 00:10:24,795 Donc, nous faisons la liaison de données bidirectionnelles entre cette case à cocher et 125 00:10:24,795 --> 00:10:32,330 cette propriété appelée souvenir de l'objet JavaScript utilisateur dans mon code là-bas. 126 00:10:32,330 --> 00:10:36,260 Alors le nom serait se souvenir, 127 00:10:36,260 --> 00:10:43,590 et ensuite nous donnerons une étiquette comme se souvenir de moi. 128 00:10:43,850 --> 00:10:46,620 Donc, lorsque l'utilisateur vérifie cela, 129 00:10:46,620 --> 00:10:50,200 alors les informations de l'utilisateur seront mémorisées ici. 130 00:10:50,200 --> 00:10:52,410 Donc, c'est la case à cocher mat-que nous avons ajoutée. 131 00:10:52,410 --> 00:10:54,270 Donc, nous avons trois champs ici, 132 00:10:54,270 --> 00:10:56,585 le nom d'utilisateur, le mot de passe, 133 00:10:56,585 --> 00:11:02,880 et ensuite une case à cocher ici dans mon formulaire ici. 134 00:11:02,880 --> 00:11:06,090 Donc, ceci est un contenu de mat-dialogue ici. 135 00:11:06,090 --> 00:11:08,800 Maintenant, en plus du contenu mat-dialogue, 136 00:11:08,800 --> 00:11:14,985 Je peux également ajouter des actions mat-dialogue ici. 137 00:11:14,985 --> 00:11:23,820 Maintenant, les actions de dialogue peuvent contenir les boutons correspondant à cette boîte de dialogue. 138 00:11:23,820 --> 00:11:28,145 Donc, c'est ce qui agira comme les boutons d'action dans le dialogue, 139 00:11:28,145 --> 00:11:32,210 et aussi comme ils sont enfermés dans le formulaire, 140 00:11:32,210 --> 00:11:36,485 ces boutons agiront aussi comme boutons de soumission de formulaire pour moi. 141 00:11:36,485 --> 00:11:44,530 Donc, ici, laissez-moi faire un espaceur flex de classe span, 142 00:11:46,580 --> 00:11:52,670 , puis laissez-moi ajouter un bouton, 143 00:11:55,950 --> 00:12:02,140 mat-button, et puis ce bouton, 144 00:12:02,140 --> 00:12:07,090 Je vais aussi le transformer en un bouton de fermeture mat-dialog. 145 00:12:07,090 --> 00:12:12,115 Donc, ce serait un bouton d'annulation que je vais inclure dans mon formulaire ici, 146 00:12:12,115 --> 00:12:14,925 alors ceci est cliqué le dialogue sera rejeté, 147 00:12:14,925 --> 00:12:17,960 et essentiellement ce qui signifie que vous ne soumettez pas le formulaire là-bas. 148 00:12:17,960 --> 00:12:20,505 Donc, cela agit aussi comme le bouton d'annulation pour le formulaire, 149 00:12:20,505 --> 00:12:23,595 et ensuite rejetant également le dialogue en même temps. 150 00:12:23,595 --> 00:12:27,180 Donc, en utilisant cet attribut à ce bouton, 151 00:12:27,180 --> 00:12:31,595 nous déclarons ceci comme le bouton qui rejette la faute, 152 00:12:31,595 --> 00:12:36,940 de la même manière que nous avons ce bouton dans la barre d'outils. 153 00:12:36,940 --> 00:12:38,990 Donc, la boîte de dialogue se ferme là. 154 00:12:38,990 --> 00:12:42,470 Ensuite, l'autre bouton que nous aurons est 155 00:12:42,470 --> 00:12:49,490 pour soumettre de sorte que 156 00:12:49,490 --> 00:12:55,030 ce type de bouton serait le bouton de soumission à l'intérieur d'un formulaire là-bas. 157 00:12:55,030 --> 00:12:56,315 Donc, quand on clique sur ceci, 158 00:12:56,315 --> 00:13:01,495 qui déclenche la soumission du formulaire pour ce formulaire ici, 159 00:13:01,495 --> 00:13:06,420 et puis laissez-moi ajouter dans une classe à ceci, 160 00:13:06,420 --> 00:13:13,795 nous dirons fond primaire, et texte floral. 161 00:13:13,795 --> 00:13:19,345 Ces classes que j'ai déjà ajoutées dans mon fichier Styles.acss là-bas. 162 00:13:19,345 --> 00:13:24,800 Donc, texte floral blanc, 163 00:13:24,800 --> 00:13:31,620 et ce bouton serait étiqueté comme le bouton de connexion là-bas. 164 00:13:31,620 --> 00:13:36,090 Donc, ce serait un bouton de couleur bleue qui sera affiché à l'écran là-bas. 165 00:13:36,090 --> 00:13:43,275 Donc, avec cela, ma structure de formulaire est créée dans le modèle là-bas. 166 00:13:43,275 --> 00:13:49,355 Maintenant, l'étape suivante consiste à entrer dans le code et ensuite gérer la soumission du formulaire lui-même. 167 00:13:49,355 --> 00:13:54,070 Donc, maintenant va se connecter au fichier component.ts, 168 00:13:54,070 --> 00:13:57,400 nous devons gérer la soumission du formulaire ici. 169 00:13:57,400 --> 00:14:02,070 Maintenant, la première étape que je vais faire est quand ce composant de connexion est créé, 170 00:14:02,070 --> 00:14:12,110 nous allons créer un objet utilisateur ici avec le nom d'utilisateur des propriétés, 171 00:14:12,110 --> 00:14:16,550 qui serait une chaîne vide pour commencer par, 172 00:14:16,610 --> 00:14:22,570 mot de passe qui sera également une chaîne vide pour commencer, 173 00:14:22,570 --> 00:14:27,050 , puis rappelez-vous ce qui est faux. 174 00:14:27,050 --> 00:14:29,640 Maintenant, en déclarant ceci ici, 175 00:14:29,640 --> 00:14:33,530 nous disons aussi que nous pouvons maintenant lier 176 00:14:33,530 --> 00:14:40,210 ces trois propriétés aux trois éléments de formulaire de mon modèle. 177 00:14:40,210 --> 00:14:43,920 Donc, c'est ce que nous avons fini par réaliser ici. 178 00:14:43,920 --> 00:14:46,440 Pour le constructeur, laissez 179 00:14:46,440 --> 00:14:55,640 m'injecter le dialogue ref ici, 180 00:14:55,880 --> 00:15:05,410 mat-dialogue ref, et ce mat dialogue ref prendra le composant correspondant. 181 00:15:05,410 --> 00:15:08,755 Donc, ceci est une référence à ce composant de connexion ici. 182 00:15:08,755 --> 00:15:11,990 Donc, cela nous dit quand cette- quand cela est soumis, 183 00:15:11,990 --> 00:15:14,060 comment gérer cela. 184 00:15:14,060 --> 00:15:21,985 Donc, ici, laissez-moi ajouter dans une fonction on submit ici, 185 00:15:21,985 --> 00:15:24,155 et à l'intérieur de la fonction on submit, 186 00:15:24,155 --> 00:15:27,935 Je vais simplement me connecter, 187 00:15:27,935 --> 00:15:32,145 enregistrer les informations correspondantes des utilisateurs, 188 00:15:32,145 --> 00:15:35,690 alors l'utilisateur clique sur le formulaire de connexion, 189 00:15:35,690 --> 00:15:39,430 le formulaire de connexion et soumet le formulaire de connexion. 190 00:15:39,430 --> 00:15:44,585 Je vais juste enregistrer les informations de l'utilisateur sur la console pour le moment. 191 00:15:44,585 --> 00:15:49,150 Plus tard, nous allons concevoir dans le cours côté serveur. 192 00:15:49,150 --> 00:15:52,310 Nous allons gérer le processus de connexion réel lorsque 193 00:15:52,310 --> 00:15:57,280 notre serveur sera prêt et sera capable de gérer la connexion de l'utilisateur. 194 00:15:57,280 --> 00:16:03,710 Donc, après cela, nous dirons ce dialogue ref close. 195 00:16:03,710 --> 00:16:06,255 Maintenant, pourquoi incluons-nous cela ici ? 196 00:16:06,255 --> 00:16:08,105 Donc, lorsque le formulaire est soumis, 197 00:16:08,105 --> 00:16:13,960 nous voulons également rejeter le composant là, 198 00:16:13,960 --> 00:16:15,190 le composant de dialogue là-bas. 199 00:16:15,190 --> 00:16:16,800 Donc, en appelant ceci, 200 00:16:16,800 --> 00:16:19,120 ce dialogue ref close, 201 00:16:19,120 --> 00:16:23,620 nous demandons que la composante dialogue soit fermée ici. 202 00:16:23,620 --> 00:16:29,650 Donc, c'est la raison pour laquelle j'ai une référence au composant login ici, 203 00:16:29,650 --> 00:16:33,655 qui agit comme mon composant de dialogue ici. 204 00:16:33,655 --> 00:16:37,445 Donc, nous serons en mesure de fermer le composant de dialogue en faisant cela. 205 00:16:37,445 --> 00:16:39,350 Donc, une fois que l'utilisateur soumet le formulaire, 206 00:16:39,350 --> 00:16:41,440 vous enregistrerez les informations de l'utilisateur, 207 00:16:41,440 --> 00:16:46,415 puis fermez la boîte de dialogue. C'est ça. 208 00:16:46,415 --> 00:16:51,640 Sauvegardons les modifications, puis allons jeter un oeil à l'application mise à jour. 209 00:16:51,640 --> 00:16:54,590 Allez dans notre application dans le navigateur, 210 00:16:54,590 --> 00:17:02,900 laissez-moi ouvrir la console JavaScript afin que vous puissiez voir les informations en cours de connexion. 211 00:17:02,900 --> 00:17:09,890 Laissez-moi ouvrir la boîte de dialogue de connexion ici avec le formulaire déjà en place, 212 00:17:09,890 --> 00:17:12,425 le nom d'utilisateur et le mot de passe déjà en place. 213 00:17:12,425 --> 00:17:15,820 Alors, laissez-moi taper le nom d'un utilisateur. 214 00:17:15,820 --> 00:17:19,165 Je suis narcissique ici. 215 00:17:19,165 --> 00:17:22,710 Donc, je saisis le nom d'utilisateur et le mot de passe ici. 216 00:17:22,710 --> 00:17:26,495 Maintenant, notez qu'en tapant les informations ici, 217 00:17:26,495 --> 00:17:33,570 puisque je montre la valeur de l'objet JavaScript utilisateur ici, 218 00:17:33,570 --> 00:17:42,775 toutes les modifications que je fais sont immédiatement reflétées à l'écran ici. 219 00:17:42,775 --> 00:17:50,110 Aussi la case se souvenir étant cochée et désactivée ici. 220 00:17:50,110 --> 00:17:53,360 Ensuite, quand je soumets le formulaire ici, 221 00:17:53,360 --> 00:17:56,040 vous pouvez voir que dans la console, 222 00:17:56,040 --> 00:17:59,350 les informations de l'utilisateur sont enregistrées sur la console, 223 00:17:59,350 --> 00:18:00,595 le nom d'utilisateur, le mot de passe, 224 00:18:00,595 --> 00:18:03,440 et la valeur de rappel est verrouillée sur la console. 225 00:18:03,440 --> 00:18:06,170 Donc, vous pouvez maintenant voir que mon formulaire de connexion, 226 00:18:06,170 --> 00:18:09,275 le formulaire piloté par modèle fonctionne correctement. 227 00:18:09,275 --> 00:18:12,305 Avec cela, nous terminons cet exercice, 228 00:18:12,305 --> 00:18:18,965 où nous avons vu comment nous pouvons concevoir un formulaire piloté par modèle dans notre application Angular. 229 00:18:18,965 --> 00:18:22,870 C'est le bon moment pour vous de faire un Git Commit avec le message, 230 00:18:22,870 --> 00:18:26,000 Modèles Driven Forms Partie 1.