RxJS Pipe does not work in Angular Resolver (but works fine in ngOnInit)

Question

we tried to add a RxJS pipe in our Angular Resolver: the resolver process starts but doesn't end, so we can't show the result in our html component.

Otherwhise, everything works correctly if we move the pipe on the ngOnInit method of the main component.

What are we doing wrong?

Example with myResolver.ts (Resolve doesn’t end his process):

resolve(): Observable<any> | Promise<any> | any {

    let T = mergeMap((user: firebase.User) => {return Observable.fromPromise(user.getIdToken()) });

    let D = mergeMap((token: string) => { return this.http.get('https://myfakedomain.com/user?access_token=' + token) });

    let P = this.afAuth.authState // return Observable<User>

    .pipe(

    T, D

    )

    return P;

    }

Example with ngOnInit on mainComponent.ts (it works!):

ngOnInit() {

    let T = mergeMap((user: firebase.User) => { return Observable.fromPromise(user.getIdToken()) });

    let D = mergeMap((token: string) => {return this.http.get(' https://myfakedomain.com/user?access_token=' + token) });

    let P = this.afAuth.authState // return Observable<User>

    .pipe(

    T, D

    ).subscribe(data => this.myData = data);

    }

score 2 · Answer 1 · answered Jun 13 '20 at 21:16

Found the answer here, it should be applicable.

It seems that a filtering operator (e.g. first, last, take...) has to be added alongside transformation operator to properly return the result.

Line from the question: let P = this.afAuth.authState.pipe(T, D)
should be extended with a filtering operator, e.g.: let P = this.afAuth.authState.pipe(T, D, first()).

RxJS Pipe does not work in Angular Resolver (but works fine in ngOnInit)

1 Answers1