代码之家  ›  专栏  ›  技术社区  ›  KLTR

非常大的阵列角度

  •  0
  • KLTR  · 技术社区  · 6 年前

    我有一个很大的数组(例如30000个项目)。我用GRPC网络把它作为一个流。

    我从grpc.client()获取数据并将其推送到数组中,然后使用 *ngFor ,但它有点慢和滞后。还有其他方法可以显示数据吗?我想用可观测数组然后用 async 但我不太明白该怎么做,这对我有帮助。

    代码如下:

    book.component.ts
    
    queryBooks() {
    const client = grpc.client(BookService.QueryBooks, {
      host: host,
    });
    client.onHeaders((headers: grpc.Metadata) => {
      // console.log("queryBooks.onHeaders", headers);
    });
    client.onMessage((message: Book) => {
     this.books.push(message.toObject())
    });
    client.onEnd((code: grpc.Code, msg: string, trailers: grpc.Metadata) => {
      trailers :', trailers);
    });
    client.start();
    client.send(queryBooksRequest);
    

    }

    我不确定一个可观测能不能解决这个问题,但它非常滞后。

    3 回复  |  直到 6 年前
        1
  •  1
  •   Leon Radley    6 年前

    正如@ploppy建议的那样,可以使用角材料cdk的数据表。

    这将限制dom中当前元素的数量,并显著加快渲染速度。

        2
  •  0
  •   Maxim V    6 年前

    我想建议使用分页,如果服务器端不可能,可以在客户端实现。对于30000个项目的问题,即使不是角度问题,也会生成太多的html元素。

        3
  •  0
  •   Miquel Angel Barragan Laso    6 年前

    你可以使用PIMEN来使用它的组件,有一个解决你的问题,只滚动显示的加载数据。

    供表: https://www.primefaces.org/primeng/#/table/scroll

    “简单”数据: https://www.primefaces.org/primeng/#/virtualscroller

    使用底漆: https://alligator.io/angular/primeng/