Loading indicators

There are basically 3 approaches to loading indicators:

• Deferable blocks: Great for components that fetch their own data and update their own state, not suitable multiple components need to react to a loading state.

@defer {
 <large-component />
} @loading (after 100ms; minimum 1s) {
 <[img](https://angular.io/api/common/NgOptimizedImage) alt="loading..." src="loading.gif" />
}

• Interceptors: the least invasive option, you write no code to mark something as loading, you also have very little control, this does not scale at all and you will pay the price of the code you didn't write.

• Controling loading indicators "manualy": maximum control, but you have to control everything. This can be aleviated with a simple service. This approach is outlined in this file.