Angular2和RXJS，收到一次数据后取消订阅

Question

我有一个订阅调用，只需要接收一次数据。它所在的 Angular 2 页面长时间运行。

我想确保订阅不会导致任何有关内存泄漏的问题，并在第一次收到数据后取消订阅。

这是我进行 api 查询的服务。它使用 .first，因此它应该在收到一次数据后进行清理。

getData(): Observable<string> {
    let _url = SOME_API_URL;
    return this._http.get(_url).first().map((response: Response) => { return response.json(); });
}

这是我的 Ng2 订阅。我需要做些什么来确保在收到 first() 数据后清理所有内容吗？

this._service.getData().subscribe((data: any) => {
    // Do something once.
    // DO I HAVE TO UNSUBSCRIBE OR WILL THE CLEANUP HAPPEN DUE TO THE ABOVE FIRST() CALL?
});

我可以使用 ngDestory 但不会被调用，因为该页面长时间运行并且不经常刷新。

Answer 1

first 不会为您订阅 Observable。

例如，如果您这样做:

Rx
  .Observable
  .of(1, 2, 3)
  .first()
  .map(x => console.log(x))

<script src="https://npmcdn.com/rxjs@5.0.0-beta.7/bundles/Rx.umd.js"></script>

什么都没发生。

所以，你需要subscribe那个Observable ...谁说subscribe说你需要自己取消订阅。

let subscription = Rx
  .Observable
  .of(1, 2, 3)
  .first()
  .map(x => console.log(x))
  .subscribe(
    (success) => {},
    (error) => {},
    (done) => { console.log('unsubscribe') }
  );

subscription.unsubscribe();

<script src="https://npmcdn.com/rxjs@5.0.0-beta.7/bundles/Rx.umd.js"></script>

只需将 subscription 保存在您的类变量之一中并实现 onDestroy 方法:

ngOnDestroy() {
  this.subscription.unsubscribe();
}

---

编辑 1:

只是为了更清楚:

如果您通过 first()，它将如您所料取消订阅。

但是，假设您的 observable 花费了很长时间并且您决定移动到您应用中的其他地方，并且该组件被销毁了。 observable 将保持事件状态(至少在它收到一个值之前)。

因此，您仍应保留 ngOnDestroy 方法，以防您的组件在取消订阅 observable 之前被销毁。