How to enforce order http requests on a list of observables in Angular 7

Question

I need to get a list of Id's ids => this.getIds() and get their names => getNames(id) for each id in the list of ids using mergeMap(). Can someone please check what I'm doing wrong below (it fails to compile)?

in, myservice.ts:

getIds()<any> {
     this.http
        .post(url1, '')
        .subscribe(map(({ Ids }: any) => Ids.map(item => ({Id: item.Id, Name: item.Name }))));
    }
getNames():Observable<any[]> {
     return this.http
        .post(url2, '')
        .pipe(map(({ Names }: any) => Names.map(item => ({Sid: item.Id, Name: item.Name }))));
}

in, component.ts:

  getIds(): void {
  this.myservice
     .getIds.pipe(
     mergeMap(id => this.getNames(id)),
     mergeMap(names => names),
     toArray()
     )
  }
getNames(): void {
   this.myservice
     .getNames(ids)
     .subscribe(val => this.data = val);
  }

Answer 1

You're not returning anything from getNames method of component, which should ideally return an Observable

getNames(): void {
   return this.myservice
      .getNames(ids)
}

Answer 2

You need to change the signature of your getIds function from:

getIds()<any> 

to

getIds(): any