在 Rxjs 中，可以使用 takeUntil 来控制另外一个 Observable 对象数据的产生。使用 takeUntil，上游的数据直接转手给下游，直到takeUntil的参数吐出一个数据或者完结。

就像一个水龙头开关，一开始是打开的状态，上游的数据一开始直接流到下游，只要 takeUntil 一旦触发吐出数据，水龙头立刻关闭。

利用这点，可以在订阅时时，在管道中添加 takeUntil，在组件销毁时吐出数据，这样这些订阅就会立刻关闭，也就达到回收内存的作用。

改造之前：

export class ExampleComponent implements OnInit, OnDestroy {subscription1: Subscription;subscription2: Subscription;ngOnInit(): void {this.subscription1 = observable1.subscribe(...);this.subscription2 = observable2.subscribe(...);}ngOnDestroy() {this.subscription1.unsubscribe();this.subscription2.unsubscribe();}
}

改造之后：

export class ExampleComponent implements OnInit, OnDestroy {destroy$: Subject<boolean> = new Subject<boolean>();ngOnInit(): void {observable1.pipe(takeUntil(this.destroy$)).subscribe(...);observable2.pipe(takeUntil(this.destroy$)).subscribe(...);}ngOnDestroy() {this.destroy$.next(true);this.destroy$.complete();}
}

值得注意的是，takeUntil必须是pipe中最后一个操作符，防止在pipe中其他的操作符产生新的流而导致失效。

总结

对比下来，你会发现takeUntil操作符会清晰简洁很多，你只需要把takeUntil(this.destroy$)加入到想要组件销毁时停止订阅的管道，即可统一管理。