取消订阅不是可观察的功能

Nat*_*May 17 unsubscribe observable typescript angular

我正在制作一个拖放应用程序,我创建了一个可观察鼠标位置,重新定位我的drag-object.

mouseMove$: any;

constructor(){
  this.mouseMove$ = Observable.fromEvent(document, 'mousemove')
    .do((mouseevent: MouseEvent) => {
      if (document.getElementById("drag-object")){
        document.getElementById("drag-object").style.left = (mouseevent.clientX) + 'px';
        document.getElementById("drag-object").style.top = (mouseevent.clientY) + 'px';
      }
  });
Run Code Online (Sandbox Code Playgroud)

通过这种实现,我可以通过这种方式订阅:

this.mouseMove$.subscribe();
Run Code Online (Sandbox Code Playgroud)

但我似乎无法取消订阅:

this.mouseMove$.unsubscribe();
Run Code Online (Sandbox Code Playgroud)

要么

this.mouseMove$.dispose();
Run Code Online (Sandbox Code Playgroud)

在任何一种情况下,我都会收到以下类型的错误:

TypeError:this.mouseMove $ .unsubscribe不是函数...

我不知道这是否与该做mouseMove$的类型any,但设置的类型,ObservableObservable<MouseEvent>没有工作.我在这里不理解什么?

Geo*_*rab 33

你可能会使用RxJS,那里一直是一个API的变化,其中较新版本的Observable.subscribe返回Disposable,你从中调用.unsubscribe现在(dispose成为unsubscribe在RxJS5).不幸的是,仍然有很多旧的教程和博客文章在那里做"旧方式",导致这种混乱.

因此,您的代码应该是

let disposeMe = this.mouseMove$.subscribe();
Run Code Online (Sandbox Code Playgroud)

在你完成之后

disposeMe.unsubscribe();
Run Code Online (Sandbox Code Playgroud)

有关从版本4到5的API更改的完整列表,请检查此文件.