Filtering doesn't render data when on another page except first

1
votes

I am using a material table with filtering and pagination. When I filter for something in the first page, it renders the results but when on another page it doesn't render them at all while typing and it returns back the right values when you finish typing (so eventually you are guessing because the values don't change dynamically). Can someone assist on that?

https://stackblitz.com/angular/dnbermjydavk?file=app%2Ftable-overview-example.ts

Reproduce it in the above example: Filter for a value in the first page and you will see dynamic rendering while typing. Search again on another page, values are disappearing and then get back when you finish typing or you don't see anything when the value doesn't exist. The problem is that the behaviour is not the same.

1
angulartypescriptangular-material

1 Answers

2
votes

    applyFilter(filterValue: string) {
      filterValue = filterValue.trim(); 
      filterValue = filterValue.toLowerCase();
      this.paginator.pageIndex = 0 //after each filter it should go to the initial page
      this.dataSource.filter = filterValue;
    }