我试过下面的代码,一切似乎都没问题(没有得到任何错误,甚至数据来自api调用)但最后我得到一个空表 .
*reloadTable*
是调用API的函数 .
Data from API call :
Empty table :
@Component({
selector: 'app-my-component',
template: `
<ngx-datatable
class="bootstrap table table-striped"
[rows]="rows"
[columns]="columns"
[columnMode]="'force'"
[headerHeight]="50"
[footerHeight]="50"
[rowHeight]="'auto'"
[externalPaging]="true"
[externalSorting]="true"
[count]="page.count"
[offset]="page.offset"
[limit]="page.limit"
[sortType]="'single'"
(page)="pageCallback($event)"
(sort)="sortCallback($event)"
></ngx-datatable>
`
})
export class NGXServerSide implements OnInit {
rows: Object[]=[];
columns = [
{ name: 'EmployeeID' },
{ name: 'Name' },
{ name: 'City' },
{ name: 'Department' },
{ name: 'Gender' },
];
constructor(private httpClient: HttpClient, private _employeeService: EmployeeService) { }
ngOnInit() {
this.pageCallback({ offset: 1 });
}
pageCallback(pageInfo: { count?: number, pageSize?: number, limit?: number, offset?: number }) {
this.page.offset = pageInfo.offset;
this.reloadTable();
}
reloadTable() {
const params = this.addTableParams();// params for api input
this._employeeService.getSortedPagedResults(params).subscribe((res: Response) => {
for (var i in res)
this.rows.push([res[i]]);
this.page.count=1;
});
}
}
1 回答
在仔细研究了你的问题之后,我看到了问题所在 . 您将数据传递给数据表但未显示 . 有两个问题:
columns = [{ name: 'EmployeeID', prop: 'EmployeeID' }]
EmployeeId: '1'
,但是您的专栏预计EmployeeID
我在ngx-datatable API文档中包含了一个链接,其中包含一些您可以使用的其他列属性 . ngx-datatable column properties