Comment personnaliser la validation de l'image de fichier de type d'entrée

Vous devez créer un formulaire personnalisé, je vais vous montrer comment la créer ( Exemple en ligne ) ou vous pouvez utiliser le module NPM ( FileInputAccessor )

étapes pour créer des formulaires et télécharger le fichier valide p>

1. Implements ControlValueAccessor LI>
2. Règles de validation personnalisées ajoutées
   • Inscrivez-vous des règles de validation personnalisées li> ul> li>
   • Écoutez des événements de changement sur vos formes réactives
     • Téléchargez le fichier valide sur votre stockage li> ul> li> OL>

       ---

       1.Implements ControlValueAccessor strong> P>

       image-formontrol.commonent p>

       p>

       export class AppComponent {
       
         firstFormGroup: FormGroup;
       
         constructor(private fb: FormBuilder) { }
       
         ngOnInit() {
           const imageFormControl = new FormControl('', ImageFormcontrolValidator.allowedTypes(['jpeg']));
       
           this.firstFormGroup = this.fb.group({
             image: imageFormControl
           });
       
           imageFormControl.statusChanges.subscribe((status) => {
             switch (status) {
               case 'VALID':
                 // Upload the valid file to your storage
                 const value = imageFormControl.value as ImageFormcontrol.Value;
                 this.upload(value.file);
                 break;
             }
           });
         }
       
         private upload(file: File) {
           console.log('upload', file);
       
           /* your custom logic
       
           const filePath = `${this.rutaImg}/${file.name}`;
               const fileRef = this.storage.ref(filePath);
               const task = this.storage.upload(filePath, file);
               this.uploadPercent = task.percentageChanges();
               task.snapshotChanges().pipe(
                   finalize(() => {
                     this.downloadURL = fileRef.getDownloadURL();
                     this.downloadURL.subscribe( url => {
                       if ( url ) {
                         this.urlImg = url;
                         console.log(this.urlImg);
                         this.validateImage = true;
                         console.log(this.validateImage );
                         return {
                           isError: this.validateImage
                       };
                       }
                    });
                   })
                )
               .subscribe();
       
             */
         }
       }