@bespunky/angular-zen
Version:
The Angular tools you always wished were there.
74 lines (73 loc) • 3.59 kB
TypeScript
import { Observable } from 'rxjs';
import { ObserveMapDirective } from '../abstraction/observe-map-base.directive';
import { ObserveMapContext, EmittedMapOf, ObservableMap } from '../abstraction/types/maps';
import * as i0 from "@angular/core";
declare type ObserveLatestContext<T extends ObservableMap> = ObserveMapContext<T> & {
observeLatest: EmittedMapOf<T>;
};
/**
* Documentation in {@link ObserveLatestDirective.observeLatest} to allow in-template tooltips.
* @export
* @class ObserveLatestDirective
* @extends {ObserveMapDirective<T, ObserveLatestContext<T>>}
* @template T The type of observables map received by the directive.
*/
export declare class ObserveLatestDirective<T extends {
[key: string]: Observable<unknown>;
}> extends ObserveMapDirective<T, ObserveLatestContext<T>> {
protected selector: string;
/**
* Combines a map of observables using rxjs {@link https://rxjs.dev/api/index/function/combineLatest combineLatest()} and exposes the emitted values to the template.
* Values are exposed in a map which keys are the same keys as the original observable map and values are
* the emitted values corresponding to those keys.
*
* Emitted values will be available as the implicit context values but will also be spread into the context by key.
* Meaning, this would work:
* ```html
* <div *observeLatest="{ x: x$, y: y$ } as result">{{result.x}}</div>
* ```
*
* And this also:
* ```
* <div *observeLatest="{ x: x$, y: y$ }; let x = x">{{x}}</div>
* ```
*
* Any template assigned with the directive will render immediately, and its view context will be updated with the emitted value on
* each emission. The directive will be responsible for subscribing on init and unsubscribing on destroy.
*
* ## Features
*
* #### Shared observable
* The watched observable will automatically be 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.
*
* #### Observer events
* 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:
* > ```html
* ><ng-template [observe]="x$" let-source="source" (nextCalled)="onNext($event)">
* > ...
* ></ng-template>
* > ```
* >
* >This **will NOT trigger** the event:
* >```html
* > <div *observe="x$; let source = source" (nextCalled)="onNext($event)">...</div>
* >```
*/
set observeLatest(value: T);
static ngTemplateContextGuard<T extends {
[key: string]: Observable<unknown>;
}>(directive: ObserveLatestDirective<T>, context: unknown): context is ObserveLatestContext<T>;
protected observeInput(input: T): Observable<EmittedMapOf<T>>;
static ɵfac: i0.ɵɵFactoryDeclaration<ObserveLatestDirective<any>, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<ObserveLatestDirective<any>, "[observeLatest]", never, { "observeLatest": "observeLatest"; }, {}, never, never, false>;
}
export {};