Revision history [back]

To select all items in an Angular Mat-table on the current page after sorting, you can use the following steps:

1. Set up a reference to the Mat-table component in the component class using ViewChild.

@ViewChild(MatTable) table: MatTable<any>;

1. Create a method to handle the selection of all items on the current page.

selectPageItems() {
  const startIndex = this.paginator.pageIndex * this.paginator.pageSize;
  const endIndex = startIndex + this.paginator.pageSize;
  const pageItems = this.dataSource.data.slice(startIndex, endIndex);
  for (let item of pageItems) {
    this.selection.select(item);
  }
}

1. Call the selectPageItems() method after sorting the table.

this.dataSource.sort = this.sort;
this.dataSource.sortingDataAccessor = (data, sortHeaderId) => {
  return data[sortHeaderId].toLocaleLowerCase();
};
this.table.renderRows();
this.selectPageItems();

This will select all the items on the current page of the Mat-table after sorting.