我在ng-for
处有多个分页。对于多个实例,我正在使用ng-for
中的变量来重复分页,但是(pagechange)事件正在使数据变异。当我更改子页面中的页面时,它正在更改数据(first_name)。我有一个转载的问题stackBlitz
我也尝试过使用索引,但是它干扰了主分页。
<ul>
<div *ngFor="let item of collection | paginate: {itemsPerPage:3, currentPage: page,id: mainPagination}; let i = index;">
<div class="user">
{{ i + 1 }}. {{ item.first_name }}
<!-- <br>Child Pagination -->
<div class="childPagination" *ngFor="let address of item.address | paginate: {itemsPerPage:3, currentPage: item['first_name'],id: item['first_name']}" style="background-color:#18bc9c">
{{ address.friend }}
</div>
<pagination-controls (pageChange)="item['first_name']= $event" [id]= "item['first_name']" class="my-pagination"></pagination-controls>
</div>
</div>
</ul>
<pagination-controls (pageChange)="page = $event" [id]= "mainPagination" class="my-pagination"></pagination-controls>
答案 0 :(得分:1)
它来自您孩子的pageChange事件。您正在尝试为项目['first_name'](实际上是第2页)分配页码。
<pagination-controls (pageChange)="item['first_name']= $event" [id]= "item['first_name']" class="my-pagination"></pagination-controls>
pageChange 是一个发出页码的事件。
我认为您可以找到一种方法,以从文档https://www.npmjs.com/package/ngx-pagination的孩子那里获得的页码获取页面数据。