Unable to get component inside router-outlet to fill space

[aks1994]

Bug Report

What is the expected behavior?

For a nested component, I am able to put the fxFlex directly onto it but not on the router-outlet. Would expect some way to do that for a router-outlet.

What is the current behavior?

Reading issues and stack overflow, suggested solutions say to wrap the router-outlet in a

but that is not working for me. The child component does not fill the space. Am I doing something wrong or is this a bug / not a supported feature? Seems strange to me that router-outlets would not be supported but please let me know, thanks.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-flex-layout-seed-aqjqri

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular v5, using angular-flex-layout 5.0.0-beta.15

[CaerusKaru]

Duplicate of #171

[aks1994]

@CaerusKaru I know it is a duplicate but I am unable to use the solutions from that thread to get it working. Can you check the stackBlitz above as well as this one: https://stackblitz.com/edit/angular-flex-layout-seed-nwmdpw?

Using both the <div fxFlex></div> and the class on router-outlet sibling property. Both are not working

[CaerusKaru]

If you have found an issue that's already open, you should comment on that issue. Most of the time others who have faced this issue (read: not me) have solutions that they are more than willing to share. This is not a support forum, and opening duplicate issues for one-off support tickets is not the way to go.

[CaerusKaru]

I had a spare moment, here's the fixed blitz: https://stackblitz.com/edit/angular-flex-layout-seed-oyjh2z?file=app%2Fapp.component.ts

[aks1994]

Perfect, really appreciate it! The encapsulation: ViewEncapsulation.None was key

[nivle]

or you could set vw to 100 for
the router-outlet wrapping div.

[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.}