该问题的解决方法取决于你使用的是哪个插件或库。在这里,我们提供一个使用ngx-pagination库的解决方法。
npm install ngx-pagination
import { NgxPaginationModule } from 'ngx-pagination';
@NgModule({
imports: [
BrowserModule,
NgxPaginationModule
],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
import { Component } from '@angular/core';
@Component({
selector: 'list',
template: `
- {{ item }}
`
})
export class ListComponent {
// 模拟数据
data = Array(50).fill(0).map((x, i) => `Item ${i + 1}`);
p: number = 1;
}
这里使用了一个假定的模拟数据数组来演示。请注意,我们还添加了一个名为“p”的成员变量,以支持分页控件对当前页数的更新。最后,使用*ngFor循环数据,并使用ngx-pagination指令在最底部添加分页控件。
完成这些步骤后,你应该能够正常的显示并使用分页功能了。