❤
npm
Sign UpSign In

ng2-rx-collector
TypeScript icon, indicating that this package has built-in type declarations

1.0.0 • Public • Published

ng2-rx-collector

Angular 2 garbage collector for RxJS subscriptions.

Benefits:

  • Clean, beautiful code
  • One property for all component's observables
  • No ngOnDestroy for cancelling subscriptions anymore (but still you can use it if you want)

Inspired by philipooo's beautiful answer.

Installation

npm install --save ng2-rx-collector

Usage

Import the Collected decorator and CollectorEvent data type (actually you can use any instead of CollectorEvent if this feels better) which will do all the magic.

import { Collected, CollectorEvent } from 'ng2-rx-collector';

Then create a property on your component which will represent the collector stopper event.

@Component({ ... })
export class MyComponent {
 
  @Collected() private collected: CollectorEvent;
 
}

Subscribe to any observable / subject using the created property as a flag, so the observable will stop producing the output when the component is being destroyed:

public ngOnInit() {
  myObservable.takeUntil(this.collected)
              .subscribe(console.log.bind(console));
 
  Observable.merge(myObservable1, myObservable2)
            .takeUntil(this.collected)
            .subscribe(console.log.bind(console));
}

That is pretty much it.

Example

This is an example you may find in the app folder.

timer.ts (representing any RxJS source):

import { Observable } from 'rxjs';
 
export let timer = Observable.interval(1000);

testpage.component.ts:

import { Component } from '@angular/core';
import { Collected, CollectorEvent } from './src';
import { timer } from './timer';
 
@Component({
  template: 'Ticking'
})
export class TestpageComponent {
 
  @Collected() private collected: CollectorEvent;
 
  public ngOnInit() {
    timer.takeUntil(this.collected)
         .subscribe(console.log.bind(console));
  }
 
  public ngOnDestroy() {
    console.log('unnecessary destroy works, subscription is still killed');
  }
 
}

License

MIT

Readme

Keywords

Package Sidebar

Install

npm i ng2-rx-collector

Repository

github.com/smnbbrv/ng2-rx-collector

Homepage

github.com/smnbbrv/ng2-rx-collector#readme

Weekly Downloads

0

Version

1.0.0

License

MIT

Unpacked Size

7.11 kB

Total Files

9

Last publish

Collaborators

  • smnbbrv
Try on RunKit
Report malware