Question

在这种情况下，哪种方法是管理Angular HTTP请求的订阅者：

我有执行get请求的按钮，然后打印结果：

模板

<button type="button" class="btn btn-primary" (click)="helloWorld()">Mod1</button>

组件

constructor(private heroService: HeroService) { }

helloWorld() {
    this.heroService.getUser().subscribe(data => console.log(data));
}

服务

constructor(private _http: HttpClient) { }

getUser() {
    return this._http.get("https://randomuser.me/api/");
}

这里的主要问题是，每次按下按钮都会创建一个新订阅，导致内存泄漏，并且由于未使用的侦听器而导致性能不佳。

如何在不影响应用程序性能的情况下实现多重获取请求？

Answer 1

在您的组件中，您可能拥有在调用服务之前检查的用户属性：

user: any;

constructor(private heroService: HeroService) { }

helloWorld() {
    if (!this.user) {
        this.heroService.getUser().subscribe(data => this.user = data);
    }
}

PS：Http调用运行一次不会导致内存泄漏或性能问题，因此您不一定需要取消订阅它们。它是流开放订阅，可能会对您的应用性能产生负面影响。（例如：表单控件valueChanges）

Angular HTTP Client多次调用

模板

组件

服务

1 个答案: