项目得到相应的加载,例如,我有3页的数据,所以总共30我。
如果我去排序或过滤数据,那么它不会显示3页,而是只显示我试图排序的那一页数据。其余2页不显示。在分页中,我得到1,而不是1,2,3。
HTML格式:
<p-table [columns]="tableHeaders" [value]="listEmrAllergy " [paginator]="true" [rows]="10" (onLazyLoad)="loadLazy($event)"
[totalRecords]="totalcount" [lazy]="!press" #tt [globalFilterFields]="tableHeaders">
<ng-template pTemplate="caption">
<div style="text-align: right">
<label>Search:</label>
<input type="text" pInputText size="25" (keypress)="press=true" [ngModel]="alpha" (ngModelChange)="searchCheck($event)" class="filter"
style="width:auto" (input)="tt.filterGlobal($event.target.value, 'contains')" autocomplete='off'>
</div>
</ng-template>
<ng-template pTemplate="header" let-columns>
<tr>
<th *ngFor="let col of columns" [pSortableColumn]="col.field">
{{col.header}}
<p-sortIcon [field]="col.field" ariaLabel="Activate to sort" ariaLabelDesc="Activate to sort in descending order" ariaLabelAsc="Activate to sort in ascending order">sooort</p-sortIcon>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-rowData let-columns="columns">
<tr>
<td *ngFor="let col of columns">
{{rowData[col.field]}}
</td>
</tr>
</ng-template>
</p-table>
TS码:
public searchCheck(evt) {
evt.length > 0 ? this.press = true :
setTimeout(() => {
this.press = false
}, 400);
}
public loadLazy(LazyLoadEvent) {
console.log(LazyLoadEvent);
const count = (LazyLoadEvent.first + 10) / 10;
this.pageNo = Math.ceil(count);
if (LazyLoadEvent.sortField) {
this.sort(LazyLoadEvent.sortField, LazyLoadEvent.sortOrder);
}
else {
this.interactionHistories;
}
}
private sort(fieldName: string, order: number) {
this.listEmrAllergy.sort((row1, row2) => {
const val1 = row1[fieldName];
const val2 = row2[fieldName];
if (val1 === val2) {
return 0;
}
let result = -1;
if (val1 > val2) {
result = 1;
}
if (order < 0) {
result = -result;
}
return result;
});
}
private getEmrAllergyList() {
let params = { 'Id': this.userId, PageNo: this.pageNo, PageSize: 10 }
this.emrService.getEmrAllergy(params)
.subscribe(allergyLists => {
this.listEmrAllergy = allergyLists.Body.Data.Items;
this.totalcount = allergyLists.Body.Data.TotalItemCount;
console.log(this.listEmrAllergy);
})
this.emrNavigation.getTotalList();