Angular 6-当父组件获取其子组件的数据时显示加载消息

Question

我有一个从服务获取数据的父组件。通过@Input传递数据，为创建子组件的每个数据迭代响应数据。用户可以在父组件中进行过滤，因此，当父组件从服务中获取数据时，所有子组件都应显示加载消息。 最好的方法是什么！

Answer 1

一种可能的方法（不是最简单的方法，但是易于理解，然后进行重构）：

• 创建一个加载服务，其中包含一个eventEmitter对象，例如：loadingEventEmitter
• 将此服务注入子组件。使用*ngIf隐藏和显示基于布尔值的加载屏幕，例如：showLoading

• 在您的组件中，从服务订阅事件发射器对象。如果LoadingEvent触发，则将showLoading布尔值变成发射的值。 像这样的东西：this.loadingService.loadingEventEmitter.subscribe( value => this.showLoading = value );

• 将此服务注入您提到的父组件。开始加载时，在需要时用this.loadingService.loadingEventEmitter.emit(true)发射发射器，完成时用.emit(false)发射。