@rx-angular/template
Version:
**Fully** Reactive Component Template Rendering in Angular. @rx-angular/template aims to be a reflection of Angular's built in renderings just reactive.
70 lines (69 loc) • 2.93 kB
TypeScript
import { ElementRef, OnDestroy, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
import { _RxVirtualViewObserver } from './model';
import * as i0 from "@angular/core";
/**
* The RxVirtualViewObserver directive observes the virtual view and emits a boolean value indicating whether the virtual view is visible.
* This is the container for the RxVirtualView directives.
*
* This is a mandatory directive for the RxVirtualView directives to work.
*
* @example
* ```html
* <div rxVirtualViewObserver>
* <div rxVirtualView>
* <div *rxVirtualViewContent>Virtual View 1</div>
* <div *rxVirtualViewPlaceholder>Loading...</div>
* </div>
* </div>
* ```
*
* @developerPreview
*/
export declare class RxVirtualViewObserver extends _RxVirtualViewObserver implements OnInit, OnDestroy {
#private;
/**
* The root element to observe.
*
* If not provided, the root element is the element that the directive is attached to.
*/
root: import("@angular/core").InputSignal<HTMLElement | ElementRef<any>>;
/**
* The root margin to observe.
*
* This is useful when you want to observe the virtual view in a specific area of the root element.
*/
rootMargin: import("@angular/core").InputSignal<string>;
/**
* The threshold to observe.
*
* If you want to observe the virtual view when it is partially visible, you can set the threshold to a number between 0 and 1.
*
* For example, if you set the threshold to 0.5, the virtual view will be observed when it is half visible.
*/
threshold: import("@angular/core").InputSignal<number | number[]>;
ngOnInit(): void;
ngOnDestroy(): void;
/**
* Hide all the virtual views.
*
* This is useful when you want to hide all the virtual views when the user cannot see them.
*
* For example, when the user opens a modal, you can hide all the virtual views to improve performance.
*
* **IMPORTANT:**
*
* Don't forget to call `showAllVisible()` when you want to show the virtual views again.
*/
hideAll(): void;
/**
* Show all the virtual views that are currently visible.
*
* This needs to be called if `hideAll()` was called before.
*/
showAllVisible(): void;
observeElementVisibility(virtualView: HTMLElement): Observable<boolean>;
observeElementSize(element: Element, options?: ResizeObserverOptions): Observable<ResizeObserverEntry>;
static ɵfac: i0.ɵɵFactoryDeclaration<RxVirtualViewObserver, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<RxVirtualViewObserver, "[rxVirtualViewObserver]", never, { "root": { "alias": "root"; "required": false; "isSignal": true; }; "rootMargin": { "alias": "rootMargin"; "required": false; "isSignal": true; }; "threshold": { "alias": "threshold"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}