ERROR TypeError: this.scrollEvent.exhaustMap is not a function at InfscrollDirective #47
Description
When I scroll on top of the chat window to load previous messages the next error fired:
ERROR TypeError: this.scrollEvent.exhaustMap is not a function
at InfscrollDirective.push../src/app/chat-app/infscroll.directive.ts.InfscrollDirective.ngAfterViewInit (infscroll.directive.ts:53)
at callProviderLifecycles (core.js:18985)
at callElementProvidersLifecycles (core.js:18959)
at callLifecycleHooksChildrenFirst (core.js:18949)
at checkAndUpdateView (core.js:19885)
at callViewAction (core.js:20117)
at execComponentViewsAction (core.js:20059)
at checkAndUpdateView (core.js:19882)
at callViewAction (core.js:20117)
at execEmbeddedViewsAction (core.js:20080)
View_ChatMessageViewComponent_0 @ ChatMessageViewComponent.html:6
proxyClass @ compiler.js:10198
push../node_modules/@angular/core/fesm5/core.js.DebugContext_.logError @ core.js:20732
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:12680
(anonymous) @ core.js:14926
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:14150
push../node_modules/@angular/core/fesm5/core.js.ApplicationRef.tick @ core.js:14926
(anonymous) @ core.js:14810
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
onInvoke @ core.js:14191
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:387
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
push../node_modules/@angular/core/fesm5/core.js.NgZone.run @ core.js:14105
next @ core.js:14810
schedulerFn @ core.js:10206
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub @ Subscriber.js:196
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next @ Subscriber.js:134
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next @ Subscriber.js:77
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next @ Subscriber.js:54
push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next @ Subject.js:47
push../node_modules/@angular/core/fesm5/core.js.EventEmitter.emit @ core.js:10190
checkStable @ core.js:14160
onLeave @ core.js:14227
onInvokeTask @ core.js:14185
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
In my opinion, the reason is with not right calling exhaustMap.
My fix is to change ngAfterViewInit
from:
ngAfterViewInit() {
this.scrollEvent = this.obs
.pipe(
pairwise(),
filter(this.isScrollingUpPastThreshold.bind(this)));
this.scrollEvent
.exhaustMap(() => this.appInfscroll()).subscribe({});
}
on:
ngAfterViewInit() {
this.scrollEvent = this.obs
.pipe(
pairwise(),
filter(this.isScrollingUpPastThreshold.bind(this)), exhaustMap(() => this.appInfscroll())).subscribe();
}
This fixed the issue in my local project and the loading of previous messages works fine.
Thanks.