Type 'Observable<any[] | Observable<any[]>>' is not assignable to type 'Observable<any[]>'

Question

I'm using ng-select v2 and angular 7.

I'm getting an error at the return statement below

getHospital(term: string = null): Observable<Hospitals[]> {
    let items = this.getHospitals1();
    if (term) {
      items = items.pipe(
        filter((x,i) => x[i].name.toLocaleLowerCase().indexOf(term.toLocaleLowerCase()) > -1)
      )
    }
    return of(items).pipe(delay(500));
  }

3 errors which says:

• Type 'Observable>' is not assignable to type 'Observable'.
• Type 'Hospitals[] | Observable' is not assignable to type 'Hospitals[]'.
• Type 'Observable' is not assignable to type 'Hospitals[]'.

here's my getHospitals1 function

getHospitals1() : Observable<Hospitals[]>{
    return this.http.get<Hospitals[]>('https://my-json-server.typicode.com/monsterbrain/FakeJsonServer/hospitals')
   }

export interface Hospitals {
  id: string;
  name: string;
  address: string;
}

What should be changed to fix this ?

Answer 1

The issue you are facing is with the line return of(items).pipe(delay(500)); It is turning your Observable<any[]> into an Observable<Observable<any[]> when using the of function. Simply pipe the current Observable to the delay and you will be good to go.

return items.pipe(delay(500));