A simple way to unsubscribe from an RxJs stream in Angular (6.0+) when the component is destroyed
For an overview of how this works see this post about unsubscription in angular
npm install take-until-destroy --save
|| yarn add take-until-destroy
import { Destroyable, takeUntilDestroy } from 'take-until-destroy'
// If you have already implemented `OnDestroy`, you don't need the `@Destroyable` decorator.
@Destroyable
@Component({
...
})
export class ExampleComponent {
constructor(randomService: RandomService) {
randomService.getObservable
.pipe(takeUntilDestroy(this))
.subscribe(v => {
console.log(v)
})
}
}
The @Destroyable
decorator doesn't work in production. See #7 for updates. The current fully working work around is to simply implement OnDestroy
for you component and it will work as expected. Example:
import { Destroyable, takeUntilDestroy } from 'take-until-destroy'
@Component({
...
})
export class ExampleComponent implements OnDestroy {
constructor(randomService: RandomService) {
randomService.getObservable
.pipe(takeUntilDestroy(this))
.subscribe(v => {
console.log(v)
})
}
ngOnDestroy() {/**/}
}