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，其中Observable.subscribe返回Disposable时发生了API更改，您现在可以从中调用.unsubscribe（{{ 1}}在RxJS5中成为dispose。不幸的是，仍然有许多旧的教程和博客文章在那里做着＃34;旧的方式＆＃34;，导致这种混乱。

因此，您的代码应该是

unsubscribe

并且，在您完成

之后

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

有关从版本4到5的API更改的完整列表，请选中this file。

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，应该注意这个问题。

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

4 个答案: