angulartypescriptobservableunsubscribe

unsubscribe is not a function on an observable

Here is my Observable

this.mouseMove$ = Observable.fromEvent(document, 'mousemove')

With this implementation, I have no problem subscribing in this way:

this.mouseMove$.subscribe();

However, I cannot seem to unsubscribe in either of the following ways:

this.mouseMove$.unsubscribe();
this.mouseMove$.dispose();

In both cases, I get the following type of error:

TypeError: this.mouseMove$.unsubscribe is not a function ...

I'm unsure if this has to do with the mouseMove$ type of any, but setting the type as Observable and Observable<MouseEvent> did not work. What am I not understanding here?

Solution

  • Observable.subscribe() returns a Subscription, from which you call .unsubscribe() (previously .dispose()). Unfortunately there are still lots of old tutorials and blog posts out there doing it "the old way", resulting in this confusion.

    Thus, your code should be

    let subscription = this.mouseMove$.subscribe();

    and, after you're done

    subscription.unsubscribe();

    For a full list of API changes from Version 4 to 5, check this file.