Load All Data Before Loading The Component View In Angular

Load All Data Before Loading The Component View in Angular

Loading Data Before Component Load In Angular

In the previous article, we have seen “how to create modern page loader using Router Events in Angular 6”. It’s nice to show a page loader when navigating one page/component to another page/component, but there are two main issues here -

• The Component view is displayed before loading data is needed to display on that component view
• Page loader completes its processing before the component view is loaded

We will see in this article how we can resolve these issues.

While working on the Angular live project, we use a real-world API and there might be some delay before the data to display is returned from the server and in that case, we don’t want to display a blank component to the users when waiting for the data. Router Resolve API helps us to implement this scenario.

Output

Application after applying the Resolve will work like below, -

 

• Read More...