Search code examples
angularrxjsswitchmap

Invalid argument type when returning object from Rxjs switchmap


In angular I have created a service that gets the data from different service and merge the data with the first service.

If the first service returns empty data then i dont need to call the second service. Here is the code

searchData(): Observable<MyData> {
    const url = `${this.context}/search`;
    return this.http.get<MyData>(url)
        .pipe(
            switchMap((myData: MyData) => {
                if (myData.data) {
                    return this.secondService.getTags()
                        .pipe(map((tagResponse: TagResponse) => {
                            // data manipultion                                 
                            return myData;
                        }));
                } else {
                    return myData;
                }
            }));
}

but this is showing

Argument of type '(myData: MyData) => MyData | Observable<MyData>' is not assignable to parameter of type '(value: MyData, index: number) => ObservableInput<any>'.
  Type 'MyData | Observable<MyData>' is not assignable to type 'ObservableInput<any>'.
    Type 'MyData' is not assignable to type 'ObservableInput<any>'.
      Property '[Symbol.iterator]' is missing in type 'MyData' but required in type 'Iterable<any>'

Solution

  • In the else block within switchMap you have to return an Observable

    return of(myData);
    

    as switchMap always expects an Observable to be returned.