Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | 1x 1x 2x 2x 2x 2x 2x | import { AfterContentInit, Directive, ElementRef, HostListener, inject, Input, OnDestroy } from '@angular/core';
const defaultVerticalOffsetLock = 10;
/**
* Autoscroll directive.
*/
@Directive({
selector: '[appAutoscroll]',
standalone: false,
})
export class AppAutoscrollDirective implements AfterContentInit, OnDestroy {
private readonly el = inject(ElementRef<HTMLElement>);
@Input() public verticalOffsetLock = defaultVerticalOffsetLock;
@Input() public observeAttributes = false;
private lockAutoscroll = false;
private mutationObserver?: MutationObserver;
private nativeElement?: HTMLElement;
public getObserveAttributes(): boolean {
return this.observeAttributes;
}
public ngAfterContentInit(): void {
this.nativeElement = this.el.nativeElement;
if (typeof this.nativeElement !== 'undefined') {
this.mutationObserver = new MutationObserver(() => {
if (!this.lockAutoscroll) {
this.scrollDown();
}
});
this.mutationObserver.observe(this.nativeElement, {
childList: true,
subtree: true,
attributes: this.getObserveAttributes(),
});
}
}
public ngOnDestroy(): void {
Iif (typeof this.mutationObserver !== 'undefined') {
this.mutationObserver.disconnect();
}
}
public isLocked(): boolean {
return this.lockAutoscroll;
}
@HostListener('scroll')
public scrollHandler(): void {
if (typeof this.nativeElement !== 'undefined') {
const scrollFromBottom = this.nativeElement.scrollHeight - this.nativeElement.scrollTop - this.nativeElement.clientHeight;
this.lockAutoscroll = scrollFromBottom > this.verticalOffsetLock;
}
}
/**
* Forces scroll down.
*/
private scrollDown(): void {
if (typeof this.nativeElement !== 'undefined') {
this.nativeElement.scrollTop = this.nativeElement.scrollHeight;
}
}
}
|