![](/img/trans.png)
[英]How to change the color when the row is unselected in the primeNg p-table?
[英]How to change Row Index Number of p-table on clicking change event of paginator in primeNg
我正在使用 p-table 列出产品。在表中,我给出了产品的序列号,如下所示:
<ng-template pTemplate="body" let-rowIndex="rowIndex" let-prodList >
<tr>
<td >{{rowIndex+1}}</td>
<td>{{prodList.name}}</td>
<td>{{prodList .color}}</td>
</tr>
</ng-template>
它适用于第一页。 但是当我单击任何其他页面时,它再次显示从 1 开始的数字,而不是其最后一页的延续。
分页代码如下:
<p-paginator [rows]="10" [totalRecords]="totalRecords" [rowsPerPageOptions]="[10,20,30]" (onPageChange)="paginate($event)"></p-paginator>
paginate(event) {
this.loading = true;
this.first = event.first;
let pageIndex = event.first/event.rows + 1;
let size = event.rows;
this.getPage(pageIndex,size)
}
getPage(pageId,size) {
this.service.getProduct(page,size).subscribe(
data => this.getProdList(data),
error => console.log(error)
);
}
getProdList(data){
this.prodList = data.list;
this.totalRecords = data.totalRows;
}
服务代码:
getProduct(pageId,size) {
const path = this.url + '/products';
const data = {'size':size,'page':pageId};
return this.http.post(path,data,{headers});
}
我该如何解决这个问题。 有人请帮助我。
我通过如下更改 html 得到了答案:
<ng-template pTemplate="body" let-rowIndex="rowIndex" let-prodList >
<tr>
<td >{{first+rowIndex+1}}</td>
<td>{{prodList.name}}</td>
<td>{{prodList .color}}</td>
</tr>
</ng-template>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.