Directive to detec end of scroll angular material

gistfile1.txt

import { Directive, HostListener, Output, EventEmitter } from '@angular/core';
@Directive({
  selector: '[scrollTracker]',
})
export class ScrollTrackerDirective {
  @Output() scrolled = new EventEmitter<any>();

  @HostListener('scroll', ['$event'])
  onScroll(event) {

    const tracker = event.target;
    let endReached = false;
    const limit = tracker.scrollHeight - tracker.clientHeight;

    if (event.target.scrollTop === limit) {
      endReached = true;
    }

    this.scrolled.emit({
      pos: event.target.scrollTop,
      endReached
    });
  }
}

gistfile2.txt

  updateScrollPos(event) {
    if (event.endReached) {
      this.filtrar();
    }
  }

gistfile3.txt

 <mat-table class="table-responsive fit-table-content" #table matSort
          [dataSource]="tableHelper.getDadosResults()" scrollTracker (scrolled)="updateScrollPos($event)"
          (matSortChange)="sortData($event)">

gistfile4.txt

import on @NgModule({ declarations: [..]