在服务中使用 Subject 代替 Observable，并在组件销毁时取消订阅 Subject。

例如，我们有一个名为 DataService 的服务，其中有一个返回 Observable 的方法 getData()，在组件中订阅此 Observable，当组件销毁时取消订阅：

import { Component, OnDestroy } from '@angular/core';
import { DataService } from './data.service';
import { Subscription } from 'rxjs/Subscription';

@Component({
  selector: 'app-data',
  template: 'Data: {{data}}'
})
export class DataComponent implements OnDestroy {
  data: any;
  subscription: Subscription;

  constructor(private dataService: DataService) {
    this.subscription = this.dataService.getData().subscribe(data => {
      this.data = data;
    });
  }

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

现在我们会看到一个报错，如果在组件销毁之后调用了 next() 方法：

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';

@Injectable()
export class DataService {
  private dataSubject = new Subject();
  data$ = this.dataSubject.asObservable();

  getData() {
    return this.data$;
  }

  updateData(data: any) {
    this.dataSubject.next(data);
  }
}

现在，无论是否取消订阅，我们都可以在服务中使用 next() 方法发布新数据，而不会导致异常。但是，由于 Subject 仍然保持对已完成的订阅的引用，因此需要在组件销毁时手动取消订阅：

import { Component, OnDestroy } from '@angular/core';
import { DataService } from './data.service';

@Component({
  selector: 'app-data',
  template: 'Data: {{data}}'
})
export class DataComponent implements OnDestroy {
  data: any;
  private subscription;

  constructor(private dataService: DataService) {
    this.subscription = this.dataService.data$.subscribe(data => {
      this.data = data;