Can't add an image with Angular

I'm trying to add a Publicite(titre,contenu,img),i don't have issues in the back (spring boot) but the problem is in the front Can anyone help me please!

*****addpublicite.component.ts

 addForm: any;
  imageURL1:any;
  userFile ;
  img:any;
 ngOnInit(): void {
    this.addForm = this.formbuilder.group({
      titre: ['', Validators.required],
      contenu: ['', Validators.required],
      img: ['', Validators.required]
    });
  }

onFileChange(event) {
    const reader = new FileReader();
    if(event.target.files && event.target.files.length>0) {
      const file = event.target.files[0];
      this.img=file;
      reader.readAsDataURL(file);
      reader.onload = () => {
        this.imagesrc = reader.result as string;
        this.addForm.patchValue({
          img: reader.result
        });
        console.log(event)
        console.log(this.img)
      };
    }
  }


  addphotoo() {
    const formData = new  FormData();
    formData.append('titre', this.addForm.value.titre);
   formData.append('contenu', this.addForm.value.contenu);
    formData.append('img', this.img.name);
    console.log(this.addForm);
    this.pubservice.createDataphoto(formData).subscribe( (data:any) => {
        this.data=data;
        this.router.navigate(['/dashboard/publicite']);
        console.log(this.data)
      },
      (err) => {alert('error.')}
    );
    console.log(this.data)
  }

******addpublicite.component.html

<form action="#" [formGroup]="addForm" (ngSubmit)="addphotoo()">
      <div class="user-details" >
        <div class="input-box">
          <span class="details">Titre</span>
          <input type="text" name="titre" placeholder="Entrer le titre" formControlName="titre" required>
        </div>

        <div class="input-box">
          <span class="details">Contenu</span>
          <textarea name="contenu" placeholder="Entrer le contenu"  formControlName="contenu"  required></textarea>
        </div>
        
        <div class="input-box">
          <span class="details">Image</span>
          <!-- accept="image/*"       (change)="handleFileInput($event.target['files'])-->
          <input
                 id="file"
                 type="file"
                 name="img"   placeholder="image"  accept="image/*"
                 (change)="onFileChange($event)"
                 required style="width: 400px"  >
          <img  [src]="imagesrc" *ngIf="imagesrc"  style="width:110px;height: 70px;margin-left: 160px;margin-top: 5px">
        </div>
      </div>

      <div class="button">
         <input type="submit" value="Ajouterphoto" >
        <input  type="submit"  value="Fermer" (click)="closeDialog()">
      </div>

    </form>

************Error in the console: status 400

and in the network: in "charge utile" i get the data: titre:pub1 contenu:kljh img:image.png