Comment utiliser Observables pour la pagination au point de terminaison REST-API?

J'utilise Angular 7 et je crée une application Web récupérant des données à partir d'un point de terminaison REST-API. Les utilisateurs mettent leur chaîne de recherche dans un champ commun formControl qui est observé. Si la valeur change dans le champ de saisie, une requête http sera envoyée au point de terminaison de l'API. Enfin, j'obtiens la réponse http comme observable que je peux m'abonner. Mais le résultat de la requête peut également contenir plus de 100 éléments. Ensuite, le point de terminaison de l'API envoie un lien SUIVANT vers la deuxième page et ainsi de suite (pagination au point de terminaison de l'API).

Mon problème est maintenant, je ne trouve pas la bonne façon d'observer le champ d'entrée de recherche ET d'interagir à travers toutes les pages SUIVANT que je reçois du point de terminaison de l'API. Séparément, cela fonctionne comme un charme.

Est-ce que quelqu'un a une bonne pratique pour mon cas d'utilisation?

Mon fichier composant:

  public requestApi(requestUrl: string): Observable<ApiDataResponse> {
    return this.sendRequest(requestUrl).pipe(
      mergeMap(result => {
        if (result['next']) {
          return this.requestApi(result['next']);
        } else {
          return of(result);
        }
      })
    );
  }

Mon fichier de service:

export class GeomapService {
  retrieveUrl = new Subject<string>();

  constructor(private http: HttpClient) { }

  public retrieveApi(searchTerm: string): Observable<ApiDataResponse> {
    this.retrieveUrl.next(baseApiUrl + '?q=' + searchTerm);
    return this.retrieveUrl.pipe(
      switchMap(url => this.sendRequest(url)),
    ).subscribe(data => {
      if (data['next']) {
        this.retrieveUrl.next(data['next']);
      }
    });
  }

  public sendRequest(url: string, httpOptions = {}): Observable<ApiDataResponse> {
    return this.http.get<ApiDataResponse>(url);
  }

}

Malheureusement, j'obtiens l'erreur suivante:

TS2322: Le type «Abonnement» n'est pas attribuable au type «Observable».   La propriété '_isScalar' est absente dans le type Â' Abonnement '.

MISE À JOUR: En ce moment, je suis un peu plus loin car j'ai réalisé que je devais fusionner / concilier les observables entrants séquentiels dans le service (fournis par une boucle).

export class GeomapComponent implements OnInit {
  searchTerm = new FormControl();
  constructor(private geomapService: GeomapService) { }

  ngOnInit() {
    this.searchTerm.valueChanges.pipe(
      debounceTime(400),
      distinctUntilChanged(),
      switchMap(term => this.geomapService.retrieveApi(term))
    ).subscribe(data => {
      if (data['results']) {
       ......
      }
    }
  }
}

Néanmoins, je traîne toujours avec le bon opérateur de combinaison / transformation, car dans cette étape avec mergeMap je reçois sur abonnement juste le résultat de la dernière réponse. Mais je souhaite également que toutes les réponses reçues auparavant soient fusionnées en une seule valeur.

Quelqu'un a-t-il une idée de la façon dont les retours dans l'opérateur devraient ressembler?

MISE À JOUR : Mise à jour du code, problème de tableau supprimé ( ApiDataResponse [] -> ApiDataResponse)