its an angular 4+ directive that prevent parent element scroll after child element scroll rich to end

its-my-scroll.directive.ts

import {Directive, ElementRef, HostListener} from '@angular/core';

@Directive({
  selector: '[appMyScroll]'
})
export class ItsMyScrollDirective {
  constructor(private _elementRef: ElementRef ) {
  }



  @HostListener('mousewheel' , [ '$event' ]) onScroll( e) {
    const d = e.wheelDelta;
    const h = this._elementRef.nativeElement.offsetHeight;
    const sh = this._elementRef.nativeElement.scrollHeight;
    const st = this._elementRef.nativeElement.scrollTop;
    if((st >= (sh - h) && d < 0) || (st === 0 && d > 0)) {
      e.preventDefault();
    }
  }
}