CODEWITHSUNDEEP
angulardatasourcemat-table
Flash
Flash

Reputation: 1014

Setting datasource to new MatTable Data Source Angular 7

When I set my data source to an array and try to set the dataSource to a new mat table dataSource to be able to use filtering it comes with I get the error:

Type 'MatTableDataSource' is missing the following properties from type 'TableRecord[]': length, pop, push, concat, and 24 more.

However, if I set the data source to any it works fine. Can someone please help me understand why:

service.ts

export interface PaginatedListResponse<TableRecord>{
  length: number,
  tableRows: Array<TableRecord>
}

export interface TableRecord{
  x: string,
  y: string,
  z: boolean,

}

.ts

dataSource: TableRecord[] = [];
this.dataSource = new MatTableDataSource(response.tableRows);
//errror: Type 'MatTableDataSource<TableRecord>' is missing the following properties from type 'TableRecord[]': length, pop, push, concat, and 24 more.

working example

    dataSource: any;
    this.dataSource = new MatTableDataSource(response.tableRows);
   //No error

Upvotes: 1

Views: 4220

Answers (1)

Lars R&#248;dal
Lars R&#248;dal

Reputation: 876

The declaration for datasource is wrong. Do it like this:

dataSource: MatTableDataSource<TableRecord> = new MatTableDataSource([]) ;

Then, when you receive data from backend:

   this.dataSource.data = response.tableRows;

Upvotes: 3

Related Questions