My table is not showing any data, the API call is succeeding in the developer tools of my browser.
There are no errors in the console.
My interface:
export interface Valuation {
data: Array<ValuationData>;
}
export interface ValuationData {
id: string;
VehicleSpecification: {
Vehicle: {
make: string;
modelSpecific: string;
};
};
}
My API call:
getValuations(limit: any, page: any, orderBy: string, filter: any, fields: any, defaultFilter: any): Observable<Valuation[]> {
this.userSessionData = JSON.parse(localStorage.getItem('userSession'));
const headers = new HttpHeaders().set('Accept', 'application/json')
.append('Authorization', 'Bearer ' + this.userSessionData.access_token);
return this.http.get<Valuation[]>(this.api_base + '/request/v1/valuation/?limit=' + limit + '&page=' +
page + '&orderBy=' + orderBy + '&filter=' + filter + '&defaultFilter=' + defaultFilter + '&fields=' + fields,
{headers: headers });
My Table Data Source
dataSource = new ValuationDataSource(this.apiService);
displayedColumns = ['id'];
export class ValuationDataSource extends DataSource<any> {
constructor(private apiService: ApiService) {
super();
}
connect(): Observable<Valuation[]> {
return this.apiService.getValuations('10', '1', '', '',
'["id","VehicleSpecification-Vehicle-make", "VehicleSpecification-Vehicle-modelSpecific"]', '');
}
disconnect() {}
}
My Table
<mat-table [dataSource]="dataSource">
<ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef> id </mat-header-cell>
<mat-cell *matCellDef="let valuation"> {{valuation.id}} </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
The API response
{"error":false,"message":"Ok","paginator":{"records":271072,"pages":27108,"currentPage":1,"recordsPage":10},"data":[{"id":6452421,"VehicleSpecification":{"Vehicle":{"make":"CITROEN","modelSpecific":"C4"}}},{"id":6452431,"VehicleSpecification":{"Vehicle":{"make":"FIAT","modelSpecific":"PUNTO"}}},{"id":6452441,"VehicleSpecification":{"Vehicle":{"make":"AUDI","modelSpecific":"A6"}}},{"id":6452451,"VehicleSpecification":{"Vehicle":{"make":"CITROEN","modelSpecific":"C1"}}},{"id":6452461,"VehicleSpecification":{"Vehicle":{"make":"FIAT","modelSpecific":"SEICENTO"}}},{"id":6452471,"VehicleSpecification":{"Vehicle":{"make":"TOYOTA","modelSpecific":"PREVIA"}}},{"id":6452481,"VehicleSpecification":{"Vehicle":{"make":"VOLKSWAGEN","modelSpecific":"PASSAT"}}},{"id":6452491,"VehicleSpecification":{"Vehicle":{"make":"VOLVO","modelSpecific":"V60"}}},{"id":6452501,"VehicleSpecification":{"Vehicle":{"make":"LAND ROVER","modelSpecific":"RANGE ROVER SPORT"}}},{"id":6452511,"VehicleSpecification":{"Vehicle":{"make":"MERCEDES-BENZ","modelSpecific":"A-KLASSE"}}}]}