Question

我有一个Angular 6应用程序，允许用户从MySQL数据库加载不同的信息树。基本上，UI上有几个按钮，当用户单击它们时会调用以下方法：

getTree(id : number) : Observable <any> {
    let url = `${ConfigService.settings.appURL}/data-tree/${id}`;

    return this.httpClient.get(url)
        .pipe(
            map(this.formatTreeData),
            catchError(this.handleError)
        );
}

有时连接速度很慢（我们必须通过GPRS连接测试应用程序），加载一棵树可能需要5到8秒。我已经意识到，如果用户在上一个调用结束之前单击另一个按钮，则应用程序将创建另一个按钮，并且返回的数据将被混合。

一个简单的解决方案是阻塞UI，直到调用结束，但是我想知道是否有一种方法可以取消正在进行的调用并开始新的调用。有什么建议吗？

谢谢！

Answer 1

一段时间后，只需取消订阅该请求

let req = this.getTree().subscribe( ... your code)

req.unsubscribe();

如何在Angular 6上取消正在进行的HttpClient请求

1 个答案: