Réception d'une image et la créer

 <input <code js>#file type="file" formControlName="photo" accept='image/*' (change)="onFileChanged($event)" />

export class ProduitFormComponent implements OnInit, OnDestroy {

selectedFile: File
  public AuthForm: FormGroup;
  public items: any;


  constructor(private ngxService: NgxUiLoaderService, private alertService: AlertService, private formBuilder: FormBuilder, private produitsService: ProduitService, private router: Router, private http: HttpClient) {

  }


  ngOnInit() {
    this.AuthForm = this.formBuilder.group({
      categorie: ['', Validators.compose([Validators.required])],
      niveau: ['', Validators.compose([])],
      marque: ['', Validators.compose([Validators.required])],
      couleur: ['', Validators.compose([])],
      prix: ['', Validators.compose([Validators.required])],
      quantite: ['', Validators.compose([Validators.required])],
      photo: ['', Validators.compose([])]
    });
  }

  public hasError = (controlName: string, errorName: string) => {
    return this.AuthForm.controls[controlName].hasError(errorName);
  }

  onFileChanged(event) {
    this.selectedFile = event.target.files[0];
  }

  



  onLoadNiveau() {
    let body = {
      niveau: this.AuthForm.get('niveau').value
    }
    console.log(body);
    this.http.post("http://localhost/SmartLibrary/api/getNiveau.php", JSON.stringify(body)).subscribe((res) => {
      this.items = res;
      console.log(res);
    });
  }



  onSubmit() {
    let categorie = this.AuthForm.get('categorie').value;
    let marque = this.AuthForm.get('marque').value;
    let couleur = this.AuthForm.get('couleur').value;
    let prix = this.AuthForm.get('prix').value;
    let quantite= this.AuthForm.get('quantite').value;
    let niveau = this.AuthForm.get('niveau').value;
    let photo = this.AuthForm.get('photo').value;
    marque = marque.trim().toLowerCase();
    const newProduit = new Produit(categorie, marque, couleur, prix, quantite);
    newProduit.niveau = niveau;
    newProduit.photo = this.selectedFile;
    this.produitsService.addProduit(newProduit);
    console.log(newProduit);
    this.http.post("http://localhost/SmartLibrary/api/addproduit.php", JSON.stringify(newProduit)).subscribe((res) => {
      let items: any = res;
      console.log(res);
      this.ngxService.start();
      setTimeout(() => {
        this.ngxService.stop();
      }, 3000);
        this.alertService.success('Succés! Produit ajouté !');
        this.ngxService.start();
        setTimeout(() => {
          this.ngxService.stop();
        }, 3000);
      });
    this.AuthForm.reset();
    this.router.navigate(['/espace-admin']); 
  }


  ngOnDestroy() {
    this.AuthForm.reset();
  }