何时/如何取消订阅：RxJS和Angular项目中的管理订阅

Question

Here's my code snippet(example)

fetchData(): void {
    if (this.subscription$) {
        this.subscription$.unsubscribe();
    }
    this.subscription$ = this.store.select('someEvent')
                                   .subscribe(data => {
                                      console.log(data);
                                   });
}

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

I need to call the fetchData method to add another subscription to get the current state from store . So at this point, I've implemented it like above in order to free up the previous subscription. It works the way I wanted it to work but I feel like the code is not neat. I was digging into takeUntil and takeWhile to make code more Rx way but I didn't make it.

Answer 1

Use a subject to signal destruction

destroyed$=new Subject()
 fetchData(): void {
this.store.select('someEvent').takeUntil(destroyed$)
                               .subscribe(data => {
                                  console.log(data);
                               });
}

ngOnDestroy() { 
   destroy$.next()
}