Téléchargement de fichiers dans Angular : comment envoyer correctement un fichier au serveur avec une barre de progression ?

Bonjour à tous ! Je suis novice en Angular (version 15) et TypeScript, et je n'arrive pas à comprendre le téléchargement de fichiers. Je dois créer un formulaire où l'utilisateur sélectionne un fichier (image ou PDF), puis l'envoie au serveur avec affichage de la progression du téléchargement. J'ai essayé d'utiliser FormData classique, mais quelque chose ne va pas. Voici mon code actuel du composant :

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-upload',
  template: `
    <input type="file" (change)="onFileSelected($event)">
    <button (click)="onUpload()">Télécharger</button>
  `
})
export class UploadComponent {
  selectedFile: File | null = null;

  constructor(private http: HttpClient) {}

  onFileSelected(event: any) {
    this.selectedFile = event.target.files[0];
  }

  onUpload() {
    const formData = new FormData();
    formData.append('file', this.selectedFile!);
    this.http.post('/api/upload