The directives provided by the ObserveModule
aim to enrich the concept presented by the async
pipe.
These directives have 3 main goals:
async
pipes in the template).Any directive from the module will tracks the assigned observable(s) and updates the template with the emitted value(s) on each emission.
Any template assigned with the directive will render immediately, and its view context will be updated with the emitted value on each emission.
Either import ObserveModule
from @bespunky/angular-zen/core
and use the directives in your templates.
If you have already imported the
CoreModule
from@bespunky/angular-zen/core
importing theObserveModule
is unnecessary, as theObserveModule
is exported by theCoreModule
.
To use the emitted values, you can use either the as
or the let
microsyntax.
The watched observable(s) are combined into a new observable, which is then automatically multicasted so that any child observables created by the template will use the same stream.
The shared observable can be accessed using the let source = source
microsyntax.
You can take advantage of the
source
observable and pass it into*onObserver
directives.
Whenever the observable changes state or emits a value, the corresponding event is emitted:nextCalled
- A value has been emitted. $event
will be the emitted value.errorCalled
- An error has occured in the pipeline. $event
will be the error.completeCalled
- The observable has completed. $event
will be void.
Because of limitations to Angular's Structural Directives, in order to bind the events the desugared syntax must be used. This, for example, will trigger the event:
This will NOT trigger the event: