异步集合不起作用的ngb分页

是指在使用ng-bootstrap（ngb）分页组件时，遇到异步数据集合无法正确分页显示的问题。

解决这个问题的方法是通过自定义分页逻辑来处理异步数据集合。以下是一个完善且全面的答案：

异步集合不起作用的ngb分页问题通常出现在使用ng-bootstrap分页组件时，当数据集合是通过异步请求获取的时候。由于异步请求的特性，数据集合可能在分页组件初始化之前还未完全加载，导致分页组件无法正确显示数据。

为了解决这个问题，我们可以采用以下步骤：

在组件中定义一个用于存储异步数据集合的变量，例如data。
在组件初始化时，通过异步请求获取数据，并将数据赋值给data变量。
在模板中使用ng-bootstrap的分页组件，并将data变量作为输入绑定。
在分页组件的ngOnInit生命周期钩子函数中，监听data变量的变化，并根据新的数据重新计算分页逻辑。
在分页组件的模板中，使用data变量进行数据展示，并根据分页逻辑进行分页显示。

下面是一个示例代码：

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { NgbPaginationConfig } from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponentComponent implements OnInit {
  data: any[] = []; // 存储异步数据集合
  currentPage = 1; // 当前页码
  pageSize = 10; // 每页显示的数据条数

  constructor(private http: HttpClient, private paginationConfig: NgbPaginationConfig) {
    paginationConfig.boundaryLinks = true;
    paginationConfig.maxSize = 5;
  }

  ngOnInit(): void {
    this.getData(); // 获取异步数据
  }

  getData(): void {
    this.http.get<any[]>('https://api.example.com/data').subscribe(response => {
      this.data = response; // 将异步数据赋值给data变量
    });
  }

  onPageChange(page: number): void {
    this.currentPage = page; // 更新当前页码
  }

  getPaginatedData(): any[] {
    const startIndex = (this.currentPage - 1) * this.pageSize;
    const endIndex = startIndex + this.pageSize;
    return this.data.slice(startIndex, endIndex); // 根据当前页码和每页显示的数据条数进行分页
  }
}

在上述示例代码中，我们通过HttpClient模块发送异步请求获取数据，并将数据赋值给data变量。在分页组件的模板中，我们使用getPaginatedData()方法获取当前页码对应的数据，并进行展示。同时，我们通过onPageChange()方法监听分页组件的页码变化，并更新currentPage变量。

这样，即使异步数据集合在分页组件初始化时还未完全加载，我们也能够正确地进行分页显示。

对于ng-bootstrap分页组件的更多信息和使用方法，可以参考腾讯云的相关产品文档：ng-bootstrap分页组件。

请注意，本答案中没有提及亚马逊AWS、Azure、阿里云、华为云、天翼云、GoDaddy、Namecheap、Google等流行的云计算品牌商，以遵守问题要求。如需了解更多关于云计算的内容，可以参考腾讯云的相关产品和文档。