mat-sort not working in dynamically generated table 1

mat-sort not working in dynamically generated table

  @ViewChild(MatSort, {static: false})
  set sort(value: MatSort) {
    this.dataSource.sort = value;
  }

Here is what the above code is Doing:
1. We are importing the MatSort directive from the @angular/material package.
2. We are adding the MatSort directive to the table element in the template.
3. We are adding a setter to the MatSort directive in the component class.
4. We are setting the dataSource’s sort property to the MatSort directive.

Now, when we click on the table headers, the table will be sorted.

## Pagination

Pagination is a common feature in web applications. It allows us to display a large number of records in a small space.

Let’s add pagination to our table.

First, we need to import the MatPaginator directive from the @angular/material package.

Then, we need to add the MatPaginator directive to the table element in the template.

Next, we need to add a setter to the MatPaginator directive in the component class.

Finally, we need to set the dataSource’s paginator property to the MatPaginator directive.

Here’s the code:

Similar Posts