Question

我必须对我的休息服务进行Http post调用，它会立即提取大量数据。当我立即拨打电话时，页面冻结约1.5秒，它显示页面上的所有数据，我可以滚动。但是在数据全部恢复之前，浏览器没有响应。

有什么方法可以阻止这种情况吗？有没有办法在我获取数据时开始渲染页面而不必等待所有数据回来？

以下是我服务的电话。

getListItems(topicType: string, topicStatus?: number) {
    const headers = new Headers({'Content-Type': 'application/x-www-form-urlencoded'}),
          options = new RequestOptions({ headers: headers});
    let   body = 'jwt=' + this.tempToken + '&type=' + topicType;
    if(topicStatus !== undefined) {
      body += '&status=' + topicStatus;
    }
    return this.http.post(this.baseUrl + 'read/topicslist', body, options).map((res) => res.json());
 }

在我的组件上，我将结果集存储在用于在模板上显示的对象上。

Answer 1

您可以更改帖子以获取数据块。当你向下滚动时，另一个帖子被发送以获得下一个块

Answer 2

他们没有解决这些大数据集问题的银弹。您可以遵循不同的方法和方法来缓解问题。有很多方法可以解决这个问题，但您的解决方案将取决于您对数据的处理方式。

根据您的问题，我了解您需要显示多个用户（类似数据集）信息，用户将滚动查看更多信息。

你可以设计如下

1）为Ajax调用添加开始和页面限制。

不是获取所有记录，而是根据您的屏幕大小以及UI上的每个记录宽度和高度获取数字记录。如果你能够在屏幕上显示大约10条记录，则将页面限制设为20条记录。

2）用户开始滚动后，您可以使用虚拟滚动来获取扩孔数据。我在我的项目中使用虚拟滚动它工作正常。 http://rintoj.github.io/angular2-virtual-scroll/

如何优化我的Angular Http Post？

2 个答案: