• Overview
@angular/core

effect

function

Registers an "effect" that will be scheduled & executed whenever the signals that it reads changes.

  
    function effect(  effectFn: (onCleanup: EffectCleanupRegisterFn) => void,  options?: CreateEffectOptions | undefined): EffectRef;
  
  

effect

Registers an "effect" that will be scheduled & executed whenever the signals that it reads changes.

Angular has two different kinds of effect: component effects and root effects. Component effects are created when effect() is called from a component, directive, or within a service of a component/directive. Root effects are created when effect() is called from outside the component tree, such as in a root service, or when the forceRoot option is provided.

The two effect types differ in their timing. Component effects run as a component lifecycle event during Angular's synchronization (change detection) process, and can safely read input signals or create/destroy views that depend on component state. Root effects run as microtasks and have no connection to the component tree or change detection.

effect() must be run in injection context, unless the injector option is manually specified.

@parameffectFn(onCleanup: EffectCleanupRegisterFn) => void
@paramoptionsCreateEffectOptions | undefined
@returnsEffectRef
Jump to details