Bug Report

Ionic Info Run ionic info from a terminal/cmd prompt and paste the output below.

cli packages: (/usr/local/lib/node_modules)

   @ionic/cli-utils  : 2.0.0-rc.6
   ionic (Ionic CLI) : 4.0.0-rc.6

local packages:

   @angular-devkit/core       : 0.6.0
   @angular-devkit/schematics : 0.6.0
   @angular/cli               : 6.0.1
   @ionic/schematics-angular  : 1.0.0-rc.6
   Ionic Framework            : @ionic/angular 4.0.0-alpha.7

System:

   NodeJS : v8.11.2
   npm    : 6.0.1
   OS     : macOS High Sierra

Describe the Bug ion-virtual-scroll does not load any elements when used inside an ion-tab.

Steps to Reproduce Steps to reproduce the behavior:

1. Generate a new Ionic v4 project with the tabs template.
2. Add a ion-virtual-scroll element following the Ionic 4 example inside one of the tab page components. See that this virtual scroll doesn’t load any children and throws no errors.
3. Remove the ion-tab that wraps the ion-router-outlet
4. See that the virtual scroll items now load.

Related Code This doesn’t work:

<ion-tabs>
  <ion-tab label="Home" icon="home" href="/tabs/(home:home)">
    <ion-router-outlet name="home"></ion-router-outlet>
  </ion-tab>
</ion-tabs>

This does:

<ion-tabs>
	<ion-router-outlet name="home"></ion-router-outlet>
</ion-tabs>

Expected Behavior ion-virtual-scroll should work inside of a ion-tab

Additional Context After poking around in https://github.com/ionic-team/ionic/blob/51c2aa69a29dec1f2bb76c1b7387716b7872fd4b/core/src/components/virtual-scroll/virtual-scroll.tsx#L366. this.scrollEl.offsetHeight logs out at 0 when wrapped in the ion-tab, but returns the correct height when not. For some reason even though the ion-scroll element exists, it has 0 height when inside the ion-tab. Wrapping the onResize() method and the scrollEl.componentOnReady() callback in a setTimeout(() => {}) fixes the issue, but seems like a hacky solution.