Development documentation
  1. Directives
  2. VisibleDirective

File

libs/upp-wdgt/src/directives/upp-visible.ts

Description

Emits an event when the visibility state changes.

This directive is useful for optimizing performance by triggering events or computations only when the element is visible.

Example :
```html
<div uppVisible (visibilityChange)="onVisibilityChange($event)">
  Observed Content
</div>
Example :
```typescript
onVisibilityChange(isVisible: boolean) {
  console.log('Element is visible:', isVisible);
}

Implements

AfterViewInit OnDestroy

Metadata

Selector [uppVisible]

Index

Methods
Inputs
Outputs
Accessors

Constructor

constructor(elementRef: ElementRef)
Parameters :
Name Type Optional Description
elementRef ElementRef No

Reference to the DOM element associated with the directive.

Inputs

threshold
Type : number
Default value : 0.1

Outputs

visibilityChange
Type : EventEmitter<boolean>

Methods

ngAfterViewInit
ngAfterViewInit()

If the element is visible upon initialization, it updates the state accordingly.

Returns : void
ngOnDestroy
ngOnDestroy()

Prevents memory leaks by ensuring the observer is properly disposed of.

Returns : void

Accessors

isVisible
getisVisible()
Returns : boolean

results matching ""

    No results matching ""