Question

我正在使用Angular2构建一个网站，该网站包含多个页面，其中包含带有各种统计信息的仪表板。

在单个页面上，分别制作了6个不同的请求（每个仪表板磁贴一个），最多可能需要5秒才能完成。当我在仪表板的请求正在进行时更改页面时出现问题。

在这种情况下，请求将开始堆叠，如果我多次更改页面，仪表板将花费越来越多的时间来加载。每个请求都按以下方式进行：

return this.http.post("http://mywebsite.com/dashboard/info", body, options)
    .map((res) => {
        return res.json()
    }).subscribe((result) => { /* do something */});

我正在寻找的是一种在我更改页面时中止所有正在进行的请求的方法，以避免它们堆叠并导致过多的加载时间。

Answer 1

当您致电subscribe时，会创建一个Subscription对象，并且该对象会一直存在，直到observable完成为止。

当您不再需要结果时，您必须从帖子请求中unsubscribe。最常见的方法是从组件的unsubscribe调用ngOnDestroy。

/**
 * Disposes the resources held by the subscription. May, for instance, cancel
 * an ongoing Observable execution or cancel any other type of work that
 * started when the Subscription was created.
 * @return {void}
 */
unsubscribe(): void;

修改

请注意，您调用share()，take()，first()或创建新的observable的任何其他运算符都不会取消HTTP请求。因为你只能取消订阅儿童的观察。

Answer 2

您想要取消订阅您的可观察订阅。订阅observable时返回订阅（在本例中为this.http.post（））。然后在页面的OnDestroy方法中，您可以取消订阅取消正在进行的http请求的订阅。

// subscription
this.subscription = this.http.post("http://mywebsite.com/dashboard/info", body, options)
    .map((res) => {
        return res.json()
    }).subscribe((result) => { /* do something */});

// within the ngOnDestroy of your component
onDestroy(){
    this.subscription.unsubscribe();
}

Angular 2 - 在路由更改时中止HTTP请求

2 个答案: