Angular Material Table: Detect what rows (items) are currently being displayed

One way that you can get the rows displayed is using the subscribe of the paginator and use the pageIndex to get the data from the dataSource.

allTasks = new MatTableDataSource<Task>([]);

@ViewChild(MatTable) table: MatTable<any>;
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sorter: MatSort;

ngAfterViewInit() {
  this.allTasks.paginator = this.paginator;
  this.allTasks.sort = this.sorter;

  this.allTasks.paginator.page.subscribe((pageEvent: PageEvent) => {
      const startIndex = pageEvent.pageIndex * pageEvent.pageSize;
      const endIndex = startIndex + pageEvent.pageSize;
      const itemsShowed = this.allTasks.filteredData.slice(startIndex, endIndex);
      console.log(itemsShowed);
  });

}

While Daniel solution works perfectly, I found something simpler.

this.allTasks.connect().value

will give you the rows displayed on the screen for the current page.

If you want all the filtered row (that might be displayed on several pages), you can also use:

this.allTasks.filteredData