Discussion on: The Ultimate Answer To The Very Common Angular Question: subscribe() vs | async Pipe

[Tomas Trajan 🇨🇭]

You can also do this.fooExists$ = this.store.pipe(select(foo), filter(foo => !!foo)); then you can also this.fooExists$.subscribe(operation). But why do you have to call something for every foo? Can't it be implemented using ngrx @Effect() ?

[Stephen Chiang]

I only need it to happen once and only one component is listening for it... Sort of like this component telling a sibling component that it is ready to do something... So I thought an effect would be Overkill, plus I'm not calling a new Action, the operation happens internally to the listening component.

[Stephen Chiang]

Would i need to manually unsubscribe in OnDestroy if I did it this way (not @Effect) as you have described?

[Tomas Trajan 🇨🇭]

Yes, whenever you do explicit .subscribe() call, you are automatically responsible to call .unsubscribe(). Even better would be to use .pipe(takeUntil(onDestroy$)) which is declarative ;)

[Stephen Chiang]

awesome, thanks!

so then I would also need to do this, right?

ngOnDestroy() {
    this.onDestroy$.next(true);
    this.onDestroy$.unsubscribe();
  }

[Tomas Trajan 🇨🇭]

ngOnInit() {
   this.source$.pipe(takeUntil(onDestroy$)).subscribe()
}

ngOnDestroy() {
    this.onDestroy$.next(true);
    this.onDestroy$.complete()
}

CHeers!