/TypeScript/Angular/RxJs When should I unsubscribe from `Subscription`

Angular/RxJs When should I unsubscribe from `Subscription`

// You don't need to have bunch of subscriptions and unsubscribe manually.
// Use Subject and takeUntil combo to handle subscriptions like a boss:


import { Subject } from "rxjs"
import { takeUntil } from "rxjs/operators"

export class ViewRouteComponent implements OnInit, OnDestroy {
  componentDestroyed$: Subject<boolean> = new Subject()

  constructor(private titleService: TitleService) {}

  ngOnInit() {
    this.titleService.emitter1$
      .pipe(takeUntil(this.componentDestroyed$))
      .subscribe((data: any) => { /* ... do something 1 */ })

    this.titleService.emitter2$
      .pipe(takeUntil(this.componentDestroyed$))
      .subscribe((data: any) => { /* ... do something 2 */ })

    //...

    this.titleService.emitterN$
      .pipe(takeUntil(this.componentDestroyed$))
      .subscribe((data: any) => { /* ... do something N */ })
  }

  ngOnDestroy() {
    this.componentDestroyed$.next(true)
    this.componentDestroyed$.complete()
  }
}

Source: stackoverflow.com

Similar codes

0 vote285 views1 answer
Angular material chips autocomplete example
TypeScript
1 vote213 views1 answer
How to move data between request
TypeScript
1 vote235 views1 answer
Typescript Error: Property 'files' does not exist on type 'HTMLElement'
TypeScript
0 vote218 views1 answer
Type 'string' is not assignable to type 'ArrayBufferLike'
TypeScript
-1 vote228 views1 answer
Components of api request
TypeScript
2 votes248 views5 answers
Plot multiple plots in r
TypeScript
0 vote253 views1 answer
Python write a program that asks the user for a weight in kilograms and converts it to pounds
TypeScript
1 vote185 views1 answer
Dynamic imports are only supported when the '--module' flag is set to 'es2020', 'esnext', 'commonjs', 'amd', 'system', or 'umd'.
TypeScript
0 vote222 views1 answer
Inno add exe in service
TypeScript
0 vote235 views1 answer
Firebase angular assets not showing
TypeScript