angular - unsubscribe 不是 observable 上的函数

Question

我正在制作一个拖放应用程序，并且我创建了一个可观察到鼠标位置的可观察对象，它重新定位了我的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';
      }
  });

有了这个实现，我以这种方式订阅没有问题：

this.mouseMove$.subscribe();

但是我似乎无法取消订阅：

this.mouseMove$.unsubscribe();

或者

this.mouseMove$.dispose();

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

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

我不确定这是否与 的mouseMove$类型有关any，但是将类型设置为Observable并且Observable<MouseEvent>不起作用。我在这里不明白什么？

Answer 1

您可能正在使用较新版本的 RxJS，其中有一个 API 更改，其中Observable.subscribe返回 a Disposable，您现在可以从中调用.unsubscribe（在 RxJS5 中变为）dispose。unsubscribe不幸的是，仍然有很多旧教程和博客文章以“旧方式”进行操作，导致了这种混乱。

因此，您的代码应该是

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

并且，在你完成之后

disposeMe.unsubscribe();

有关从版本 4 到 5 的 API 更改的完整列表，请查看此文件。

Answer 2

首先确保您this.mouseMove$是可观察的：

if (this.mouseMove$ !== undefined) {
  this.mouseMove$.unsubscribe();
}

可能在您的情况下，您之前取消订阅this.mouseMove$还没有被分配任何价值。

Answer 3

  this.getValue= this.ntUser.salesEnquiry()
      .subscribe(
        (result) => {
    // some action
          this.getdataapi.unsubscribe();
        },
        (error) => {
          // some action
        }
      );
  }

Answer 4

看看brianflove.com。

通过设置 mouseMove$:ISubscription，应该可以解决这个问题。