Expose emptyRouterOutlet for lazy loaded auxiliary routes

[mhartington]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Performance issue
[x] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
[ ] Other... Please describe:

Current behavior

Continuing the discussion in #10981, per @jasonaden's request

Right now, the fix for lazy-loaded auxiliary routes is an internal one, directly tied to routerOutlet. While this is fine for vanilla Angular Apps, Frameworks built on top of Angular, Ionic in this instance, are not able to take advantage of the fix, as our ion-router-outlet is a customized router-outlet.

Expected behavior

The logic used to fix lazy loaded routes internally should be exposed, or configurable for downstream frameworks.

Minimal reproduction of the problem with instructions

Since this is Ionic specific, I've created a sample project

https://github.com/mhartington/lazy-loaded-tabs

What is the motivation / use case for changing the behavior?

The motivation would be for other frameworks using Angular's Router to hook into the EmptyRouterOutlet, but not directly use RouterOutlet.

Environment

Angular version: 6.1.0-beta

[nschipperbrainsmith]

Today I also ran into this problem, while I'm not yet on the 6.1.0-beta version I'm glad to see you already tested it and found out that my exact use case hasn't been covered by the fixes yet.
I for example want to have a popup window in the base route of the lazy loaded module.

The only workaround I've so far had success with is the following one:
Where I do a redirect, it isn't pretty but seems like the only solution for now sadly.

{
		path: "",
		redirectTo:"overview",
		pathMatch: 'full'
	},
	{
		path: "overview",
		component: OverviewPage,
		children: [
			{
				path: "batch",
				outlet: "popup",
				component: PopupComponent,
				data: {
					dialog: DialogExampleComponent
				}
			}
		]
	}, {
		path: ":id",
...

[angular-robot]

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

[angular-robot]

Thank you for submitting your feature request! Looks like during the polling process it didn't collect a sufficient number of votes to move to the next stage.

We want to keep Angular rich and ergonomic and at the same time be mindful about its scope and learning journey. If you think your request could live outside Angular's scope, we'd encourage you to collaborate with the community on publishing it as an open source package.

You can find more details about the feature request process in our documentation.

[atscott]

Hey @mhartington, is this issue still relevant?

angular/packages/router/src/utils/config.ts

Lines 167 to 170 in 1da3a05

	if ((!c.component && !c.loadComponent) && (children || c.loadChildren) &&
	(c.outlet && c.outlet !== PRIMARY_OUTLET)) {
	c.component = EmptyOutletComponent;
	}

The code for the fixed issue you linked is above. It happens as part of a config standardization when providing routes. If ionic were to implement a similar config standardization such that you use your own IonicEmptyOutletComponent, then the Angular Router would never attach its own EmptyOutletComponent. That solution seems somewhat reasonable to me. Maybe you've come up with an alternative solution as well. Expanding the API just for this rare use-case when there is a solution with the existing APIs seems like something we shouldn't do.

[atscott]

I'm actually going to close this per my comment above. There are ways to work around this by preventing the componentless aux routes not happen by transforming the routes before the Angular Router gets ahold of them. Then the EmptyOutletComponent would never be used.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}