Javascript 问题：单击角度中的分页结果时获取索引

我有一些问题，在我的应用程序中，我有一些分页结果，但当我在ngFor中添加变量let I=index时，我只能得到前10个项目的结果，而不是分页的项目？因此，如果我转到第2页，点击第一项，索引再次为1，就像我做的索引+1一样

到目前为止，代码是：

import { Component, VERSION, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  name = 'Angular ' + VERSION.major;
  collection: any;
  p: number;
  itemsPerPage = 10;
  totalItems: any;
  constructor(private http: HttpClient) {}

  ngOnInit() {
    this.getAllData();
  }

    getIndex(i) {
    console.log(i + 1);
  }

  getAllData() {
    const url = `https://xxxx/api/houses?page=1&pageSize=${this.itemsPerPage}`;
    this.http.get(url).subscribe((data: any) => {
      console.log(data);
      this.collection = data;
      this.totalItems = 450;
    });
  }

  getPage(page) {
    const url = `https://xxxx/api/houses?page=${page}&pageSize=${this.itemsPerPage}`;
    this.http.get(url).subscribe((data: any) => {
      console.log(data);
      this.collection = data;
      this.totalItems = 450;
    });
  }
}

component.html

<ul>
    <li *ngFor="let item of collection | paginate: { itemsPerPage: itemsPerPage , currentPage: p, totalItems: totalItems }  let i = index"> {{item.name}}                     <button (click)='getIndex(i)'>Index</button>
    </li>
</ul>

    <pagination-controls (pageChange)="getPage(p = $event)"></pagination-controls>

{{item.name}index

---

有什么想法吗？

您可以像这样更新

getIndex

方法，在考虑分页的情况下计算总索引：

getIndex（一）{
let-pages系数；
如果（！this.p | | this.p==1）{
系数=0；
}否则{
页面系数=（this.p-1）*this.itemsPerPage；
}
console.log（i+1+pageCoefficient）；
返回i+1+1系数；
}

---

应该发生什么？你想做什么？所以当我点击索引按钮clickIndex时，它应该给我该项目的索引，但现在如果你看stackblitz，它只给我第一页项目的索引，如果我转到第2页，点击项目1，它仍然给我数字1，当它应该是11 OK很好，但最初我使用索引值将值传递给路由器链接

[routerLink]=“['/details'，I+1]”

如何实现这一点？传递

getIndex

值<代码>[routerLink]=“['/details'，getIndex（i）]”。这有什么问题？返回为未定义您正在返回值，对吗？我会更新我的回答我也更新了stackblitz；您现在可以在按钮中看到每个数字。