[Feature Request] Loading Overlay Component Target

[Daeluse]

Feature Request

This is a use enhancement for the current Loading Indicator Overlay to extend the API.

What is the expected behavior?

Currently, there are two methods to invoke the creation of a Loading Indicator Component, each which have different outcomes.

The Template Syntax method replaces everything within its scope with a Loading Component where the Loading Service call appends an Overlay the current view obscuring the content though not completely.

I would like to see a way in which the Overlay can be created with the same constraints as the Template Syntax method so that you can target which component the Overlay is obscuring.

The Loading Service requires a ViewContainerRef be passed into it, however it only accepts Root references, meaning that the following cannot be utilized.

@ViewChild(TargetComponent, {read: ViewContainerRef}) TargetComponent: TargetComponentType;

The latter will give you an instance of ViewContainerRef, but it is not a complete instance, and therefore cannot be used with the service.

The only way to target a component for the overlay is to have the service as part of the targeted component. I want to achieve the creation of two Overlay loads, a PageLoader and a ScreenLoader, essentially. The PageLoader will Overlay only the Main Body Content (Not the Sidebar or the Header) which signifies that the user can navigate away from the page, and the action will not be canceled. The ScreenLoader will Overlay the Main Body Content and the Sidebar, to prompt the user that the action cannot be navigated from.

In my situation, I am utilizing a combination of layouts eventually drilling down to a single router-outlet (similar as to how it is presented in the repo) for all page routes, which allows for a simple folder structure. As it stands, the only way for me to achieve my desired outcome would be to break up the main template into a few smaller templates and create the overlays within the service at the level of the individual templates which would get pretty messy.

I would like to suggest either that the Template Syntax is changed so that it does not replace the inner content, but provides the reference for creating an overlay for the inner content, or the Loading Service Construct is modified so that it utilizes a ShadowDOM reference rather than a root ViewContainerRef.

[emoralesb05]

Going to refactor some stuff in the loading module to make this possible with an extra input.

Possibly:
strategy="overlay"