Angular 9 cdk虚拟滚动-即使用户滚动，滚动索引也不会更改

我使用angular 9使用CdkVirtualScrollViewport执行无限滚动。我正在调用

（scrolledIndexChange）

以检测索引更改。随着索引的更改，我希望从API加载更多数据

但问题是指数总是为零。即使用户尝试滚动，索引值也不会更改

在我的API中有两个字段-limit和skip。Limit指定要检索的记录数，skip指定要跳过的记录数。因此，索引

scrolledIndexChange

0的跳过值为0，如果

scrolledIndexChange

大于零，则跳过值将增加

但这一指数没有改变。我还检查了它是否还没有到达最后一页

.ts

html

{{item.purchase\u stock\u id}

您是否设法解决了此问题？您是否设法解决了此问题？

import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';

@ViewChild(CdkVirtualScrollViewport) viewport: CdkVirtualScrollViewport;

  constructor(public FactService : FactService) {
    this.get_count()
  }

get_count(){
    this.FactService.getcount().subscribe(data => {
      if(data){
        console.log(data.count)
        this.count = data.count
        this.total_pages = Math.ceil(data.count/this.limit)
        console.log(this.total_pages)
      }
    })
  }

  trackByIdx(i: number) {
    return i;
  }

  getdata(limit, skip){

    this.FactService.getdata(limit, skip).subscribe(data =>{
      if(data){
        console.log(data);
        this.infinite = this.infinite.concat(data)
        }
    })
  }


  index(val) {

    this.page ++ ;
    console.log(val)
    console.log(this.page , this.total_pages)
    if(val == 0) {
      console.log("zero")
     this.getdata(8,0)
    }

    else {

      if(this.page === this.total_pages) {
        console.log("finished")
        return ;
      } 
      else {
        const end = this.viewport.getRenderedRange().end;
        const total = this.viewport.getDataLength();
        console.log(`${end}, '>=', ${total}`);

        console.log("else")

        if(end === total) {

         this.getdata(this.limit, this.skip+8)

        }
      }


    }

<cdk-virtual-scroll-viewport  itemSize="100" (scrolledIndexChange)= "index($event)">

 <li  *cdkVirtualFor="let item of infinite; trackBy: trackByIdx"> 
     {{item.purchase_stock_id}}

 </li>
</cdk-virtual-scroll-viewport>