common-ui/src/lib/scrollbar/has-scrollbar.directive.ts
2021-08-27 00:23:09 +03:00

28 lines
769 B
TypeScript

import { AfterContentChecked, Directive, ElementRef, HostBinding } from '@angular/core';
@Directive({
selector: '[iqserHasScrollbar]',
exportAs: 'iqserHasScrollbar'
})
export class HasScrollbarDirective implements AfterContentChecked {
@HostBinding('class') class = '';
constructor(private readonly _elementRef: ElementRef) {}
get hasScrollbar(): boolean {
const element = this._elementRef?.nativeElement as HTMLElement;
return element.clientHeight < element.scrollHeight;
}
ngAfterContentChecked(): void {
this._process();
}
_process(): void {
const newClass = this.hasScrollbar ? 'has-scrollbar' : '';
if (this.class !== newClass) {
this.class = newClass;
}
}
}