Skip to content

SiResizeObserverDirective documentation

selector
[siResizeObserver]

Directive to emit events on element size change. Use like this: <​div (siResizeObserver)="handleResize($event)"​> When the size of the element changes, an event in the format { width: number, height: number } will be emitted. Also an initial event will be emitted on init.

By default, events are throttled and to an event every 100ms. To change this, add [resizeThrottle]="200" on the same element. Input in milliseconds.

Input Properties

Name Type Default Description
emitInitial
boolean true Whether to emit the element's dimensions when the directive initializes.
resizeThrottle
number 100 Minimum time in milliseconds between resize events.

Output Properties

Name Type Description
siResizeObserver
ElementDimensions Emits the observed element's current width and height.

Types Documentation

Properties
height: number
width: number

Except where otherwise noted, content on this site is licensed under MIT License.