首先,确认您是否按照以下方法引入了CDK-Virtual-Scroll-Viewport:
import {ScrollingModule} from "@angular/cdk/scrolling";
@NgModule({
imports: [
ScrollingModule,
// Other imports...
],
//...
})
export class AppModule {}
如果还是不起作用,请尝试在Angular组件类中使用CDK-Virtual-Scroll-Viewport,如下所示:
import { Component, OnInit, ViewChild } from '@angular/core';
import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
export class AppComponent implements OnInit {
@ViewChild(CdkVirtualScrollViewport)
public virtualScroll: CdkVirtualScrollViewport;
ngOnInit() {
// ...
}
// ...
}
确保您已在HTML中正确使用CDK-Virtual-Scroll-Viewport:
{{item}} ({{i}})
最后,确认您的CDK-Virtual-Scroll-Viewport是否正确初始化并将数据传递给它:
items: any[] = [];
...
this.items = [/* Array of items to display */];
this.virtualScroll.renderedRangeStream.subscribe(range => {
console.log('Range changed: ', range);
});
执行这些操作后,您的CDK-Virtual-Scroll-Viewport应该可以按预期工作。