Skip to content

🤓 RxJS operator that unsubscribes from observable on Angular component destruction

License

Notifications You must be signed in to change notification settings

orchestratora/ngx-until-destroyed

 
 

Repository files navigation

🤓 Angular - Unsubscribe For Pros 💪

Build Status Coverage Npm Npm Downloads Licence semantic-release

Declarative way to unsubscribe from observables when the component destroyed

Installation

$ npm install @orchestrator/ngx-until-destroyed --save

Usage

import { untilDestroyed } from '@orchestrator/ngx-until-destroyed';

@Component({
  selector: 'app-inbox',
  templateUrl: './inbox.component.html',
})
export class InboxComponent implements OnInit, OnDestroy {
  ngOnInit() {
    interval(1000)
      .pipe(untilDestroyed(this))
      .subscribe(val => console.log(val));
  }

  // This method must be present, even if empty.
  ngOnDestroy() {
    // To protect you, we'll throw an error if it doesn't exist.
  }
}

Use with decorator

import { WithUntilDestroyed } from '@orchestrator/ngx-until-destroyed';

@Component({...})
class MyComponent implements OnDestroy {
  @WithUntilDestroyed()
  stream$ = interval(1000); // You can safely subscribe to this everywhere

  // This method must be present, even if empty
  ngOnDestroy() {}
}

Use with any class

import { untilDestroyed } from '@orchestrator/ngx-until-destroyed';

export class Widget {
  constructor() {
    interval(1000)
      .pipe(untilDestroyed(this, 'destroy'))
      .subscribe(console.log);
  }

  // The name needs to be the same as the decorator parameter
  destroy() {}
}

About

🤓 RxJS operator that unsubscribes from observable on Angular component destruction

Topics

Resources

License

Code of conduct

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 89.9%
  • JavaScript 10.1%