Promise调用在Angular 11中被调用两次

Question

我有下面的代码，它调用一个服务来获取一些值，我故意关闭后端部分以检查是否添加了错误。我注意到它打了两次服务电话，有人能解释一下为什么会发生这种情况吗？

(async () => {
try {
this.countries = await this.testerSvc.getCountries().toPromise();
} catch (err) {
this.addError("Countries");
}
})();

服务代码：

getCountries() {
return this.http.get<[]>(this.baseUrl + "countries");
}

Answer 1

在我的app.module.ts上，我添加了我的组件：

bootstrap: [AppComponent, MyComponent]

在我的app.component.html上，我有

<app-tester> </app-tester>

它实例化了我的组件两次，我从引导程序中删除了它，现在它只实例化了一次。所以服务呼叫只有一次。