Nested page router outlets height not adjustable (ios)

Question

I am using this example that has nested page-router-outlets. I discovered that the nested router will always take 100% percent of the page height on iOS, while on Android it will obey what you tell it.

For example, if you did something like this the nested page-router-outlet will be the full height on iOS but on Android it will actually be 400 tall

<GridLayout rows="400, *">
    <GridLayout row="0">
        <page-router-outlet></page-router-outlet>
    </GridLayout>

    <GridLayout row="1">
        <Label text="Some other content"></Label>
    </GridLayout>
</GridLayout>

Answer 1

It is working perfectly fine on ios well. There may be some other issue with your code only. As suggested by you, I have cloned the github code and added that to playground for your to test. You can access the playground from here.

What I would suggest is to add your child in above playground and test. May be that child component has 100% height that would be overlapping the parent.