问题
In my code when you click on any of the record you will see the details. In the details there are 2 links (previous, next) to navigate to previous n next record. On the first page it is working fine. But when I navigate to next page from pagination and click on previous n next it still taking the first page row index and previous n next is happening from the row instead of select row.
You can view here: https://angular-ivy-hkrfyu.stackblitz.io/
nextRecord() {
let next = (this.currentIndex += 1);
if (next > this.allUserTableData.length - 1) {
this.currentIndex = 1;
return;
}
let nextRecord = this.allUserTableData[next];
this.userObj = nextRecord;
console.log(nextRecord, next);
}
previousRecord() {
let next = (this.currentIndex -= 1);
if (next < 0) {
this.currentIndex = 0;
return;
}
let nextRecord = this.allUserTableData[next];
this.userObj = nextRecord;
console.log(nextRecord, next);
}
<button (click)="previousRecord()">Previous</button> | <button (click)="nextRecord()">Next</button>
回答1:
find working example here in this StackBlitz Link
I have added new parameter inside viewuser()
<tr class="record-row" (click)="viewUser(user, i, filteredUsers, 5, page)"
and inside viewUser()
viewUser(user: any, index, filterData, itemsPerPage, currentPage) {
console.log(itemsPerPage, currentPage);
let currentPageIndex = currentPage;
let recordPerPageToShow = itemsPerPage;
let findCurrentRecordToSkip = (currentPageIndex - 1) * recordPerPageToShow;
let countIndex = findCurrentRecordToSkip + recordPerPageToShow;
console.log(
"filter-pagination",
filterData.slice(findCurrentRecordToSkip, countIndex)
);
this.isView = true;
console.log(user, index, filterData);
this.userObj = user;
this.currentIndex = index;
this.allUserTableData = filterData.slice(
findCurrentRecordToSkip,
countIndex
);
}
来源:https://stackoverflow.com/questions/65698330/why-my-next-and-previous-control-not-able-to-take-the-correct-index-when-paginat