ng-util-directive
TypeScript icon, indicating that this package has built-in type declarations

2.4.1 • Public • Published

ng-util-directive

Installation

npm i ng-util-directive

Requirements

Minimum angular version: 14.0.0

Available Directives

Import Description Usage
import { NgSkeletonModule } from 'ng-util-directive' A skeleton directive which shows as an overlay on top of the dom element <img (load)="loading = false" *skeletonLoader="loading; data: {shape: 'circle', size: '100px' }; hideOnLoading: true" style="width: 100px; height: 100px; border-radius: 50%;" src="avatar.svg"/>
import { NgContainerResizeModule } from 'ng-util-directive' A directive which emits the resize event for a container. Which internally uses ResizeObserver <div (containerResize)="handleContainerResize($event)">Some Content </div>
import { NgContainerIntersectionModule } from 'ng-util-directive' A directive which emits the intersection event for a container. Which internally uses IntersectionObserver <div (containerIntersection)="handleContainerIntersection($event)" [containerIntersectionOptions]="{rootMargin: '-200px', threshold: 1, root: rootElement}">Some Content </div>
import { NgDraggableModule } from 'ng-util-directive' A directive makes the host element draggable and makes it sticky to edges of screen <div draggable [draggableSticky]="true" draggableStickyMargins="1rem" draggableStickyTransition="left 0.3s ease" draggableTeleportTo="modal-container">Any content</div>
import { NgDebounceEventModule } from 'ng-util-directive' A directive which emits the given event with a provided debounce <input (debounceEvent)="handleEvent($event)" debounceEventName="input" [debounceEventTimer]="500" placeholder="Type something"/>
import { NgClickOutsideModule } from 'ng-util-directive' A directive which emits click event when clicked outside of the host element <div (clickOutside)="handleClickOutside($event)">Some Content</div>

Storybook Demo

Storybook Demo Link

Storybook website link

Stackblitz Demo

Stackblitz Demo Link

“Stackblitz

Versions

Current Tags

VersionDownloads (Last 7 Days)Tag
2.4.140latest

Version History

VersionDownloads (Last 7 Days)Published
2.4.140
2.4.00
2.3.00
2.2.00
2.1.10
2.1.00
1.2.20
1.2.10
1.2.00
1.1.00
1.0.40
1.0.30
1.0.20
1.0.10
1.0.00

Package Sidebar

Install

npm i ng-util-directive

Weekly Downloads

40

Version

2.4.1

License

MIT

Unpacked Size

240 kB

Total Files

40

Last publish

Collaborators

  • amithbr6