service.ts 是否在 component.ts 之前执行？

Question

我正在开发一个 angular 应用程序，我想从 REST API 获取数据并以图形的形式在浏览器上显示它。问题是图形会在 ngOnInit() 初始化后立即呈现。我想问的是先执行.component.ts文件还是先执行.service.ts？如果我在 .service.ts 中获取数据，然后将其传递给 .component.ts 以显示在浏览器上，可以吗？

Answer 1

我明白你的问题，你可能会问：

是否在依赖于服务的组件中 ngOnInit 之前调用服务构造函数？

答案是肯定的。构造函数实际上是在第一次需要服务的时候被调用的，这意味着组件第一次被渲染的时候，这可能比应用程序启动晚得多(bootstrap)。

如果我在我的.service.ts中获取数据，然后将其传递给.component.ts以显示在浏览器上，可以吗？

不，不会的，因为上面说了，服务一构建就开始加载数据，但是数据还没有到，因为操作是异步的。

您需要等待组件中的数据。如果您使用的是 HttpClient，则可以使用 observables 来实现。

//service.ts
loadData() {
   return this.http.get<Response>('/data/path')
}

//component.ts
ngOnInit() {
    this.service.loadData().subscribe(
        data => this.processData(data),
        error => this.error = error
    )
}

private processData(data: DataResponse) {
    this.data = data;
    this.renderChart();
}

异步数据处理是前端编程的一个关键概念，它解释了所有工作如何超越单个 Whosebug 答案。我建议读者阅读一些关于 Angular Http、RxJS、API 通信或一般异步性的教程。

service.ts 是否在 component.ts 之前执行？

Does service.ts get executed before component.ts?

angular

angular-fullstack