Tooling to handle your effects (subscriptions)!
npm install @angular-kit/effectsrxEffect is a standalone convenience function to take care of a subscription and
execute side effects.
You can run a single effect
const intervalEffect = rxEffect().run(interval(1000), console.log)
// or
const effects = rxEffect();
logEffect = this.effects.run(...)Or create a group of effects:
const effects = rxEffect(({run}) => {
run(interval(1000), v => console.log(v))
// run more effects
})Note that you need to use rxEffect within an injection context. If you want to
use it outside an injection context you can pass the Ìnjector as argument.
When a rxEffect-instance is destroyed you can execute code which is registered in the runOnInstanceDestroy-hook.
runOnInstanceDestroy is executed whenever the repsective DestroyRef.onDestroy-callback is executed.
Example for standalone function
const effects = rxEffect()
effects.runOnInstanceDestroy(() => // do something e.g. interact with local storage)Example for factory function
const effects = rxEffect(({runOnInstanceDestroy}) => {
runOnInstanceDestroy(() =>
// do something e.g. interact with local storage
)
})When creating an effect:
const effects = rxEffect()
const logEffect = effects.run(of(1), console.log)You can optionally specify a callback which is executed one time if either cleanUp() is called on this single
effect or the DestroyRef.onDestroy()-callback iun the current scope executed. Whatever comes first will be executed.
You do this by:
const effects = rxEffect()
const logEffect = effects.run(of(1), console.log, {onCleanUp: () => {}})You can call cleanUp() on the rxEffect instance to destroy the instance.
When creating an effect:
const effects = rxEffect()
const logEffect = effects.run(of(1), console.log)You get a EffectCleanUpRef which exposes a cleanUp-function. You can call this function and
destroy this single effect.
See this stackblitz