Ale*_*dro 6 primeng angular primeng-turbotable
在我的 angular 5 项目中,我有一个 PrimeNG 表,我想从 url 加载分页参数,例如: http://.... tickets?first=10&sortField=exitDate&sortOrder=1
问题是当我刷新页面时,我没有看到正确的 sortIcon 和正确的分页器。
在component.ts onInit 我从一个数组中的 url 加载所有参数:
this.route.queryParams.subscribe((params: Params) => {
for (const param in params) {
filters.push({ property: param, value: params[param] })
}
this.preloadFilterFields(filters)
})
Run Code Online (Sandbox Code Playgroud)
然后我把参数放在事件中
preloadFilterFields(filters: Filter[]) {
for (const filter of filters) {
if (filter.property === 'first') {
this.event.first = filter.value;
} else if (filter.property === 'sortField') {
this.event.sortField = filter.value;
} else if (filter.property === 'sortOrder') {
this.event.sortOrder = filter.value;
}
}
}
Run Code Online (Sandbox Code Playgroud)
这是table.html
<p-table [value]="ticketList" [lazy]="true" (onLazyLoad)="loadModelData($event)" [paginator]="true"
[totalRecords]="totalElements"
[rows]="10" [responsive]="true"
[loading]="loader" dataKey="createdDate" [sortField]="event.sortField"
[sortOrder]="event.sortOrder">
Run Code Online (Sandbox Code Playgroud)
事件是这样初始化的,第一次加载表格时,我看到了正确的分页和排序:
event: LazyLoadEvent = { sortOrder: -1, sortField: 'createdDate' };
Run Code Online (Sandbox Code Playgroud)
但是,当我更改分页event.sortOrder并尝试刷新页面时,我看到了正确的事件,但没有看到正确的 sorticon/paginator
============================更新==================== ========== https://stackblitz.com/edit/angular-4qz1ye?file=app%2Fapp.component.ts 我需要以编程方式使用代码中的参数重新排序该表(而不是单击进入表)可能吗?
| 归档时间: |
|
| 查看次数: |
4574 次 |
| 最近记录: |