Angular9/Ionic 5 Ion-Split-pane issues

For Some reason beyond my comprehension I am having issues with the ion-split-pane element.

If I remove the split-pane element the router-outlet works just fine. and My nav is shown after login is successful. Only problem is I have a mobile feel web app :/ with a click to open menu on desktop screens as well. I know I could go CSS and bootstrap to come up with something. But it irks me that I cant figure this out. HELP!

It is:
A. Not doing the split pane thing based on the screen size
B. Somehow it interferes with pages being loaded into the router-outlet

app.component.html:

  <ion-split-pane contentId="main-content" [when]="true">
    <ion-menu content="content" *ngIf="this.authInfo | async" contentId="main-content" type="overlay">
      <ion-header>
        <ion-toolbar>
          <ion-title>Menu</ion-title>
          <ion-menu-button slot="end">
            <ion-icon name="close-circle-outline"></ion-icon>
          </ion-menu-button>
        </ion-toolbar>
      </ion-header>
      <ion-content>
        <ion-list id="profile-section">
          <ion-menu-toggle auto-hide="false" *ngFor="let k of orderedKeys();">
            <ion-item (click)="handleClick(k)"  detail="false"  lines="none" class="active" [class.selected]="testSelection(appPages[k].name)">
              <ion-icon slot="start" [name]="appPages[k].icon + '-outline'"></ion-icon>
              <ion-label>{{appPages[k].title}}</ion-label>
            </ion-item>
          </ion-menu-toggle>
        </ion-list>
      </ion-content>
    </ion-menu>
    
    <ion-header *ngIf="this.authInfo | async">
      <ion-toolbar>
        <ion-buttons slot="start">
          <ion-menu-button></ion-menu-button>
        </ion-buttons>
        <ion-title>{{section}}</ion-title>
      </ion-toolbar>
    </ion-header>
    
    <ion-router-outlet id="main-content" #content main></ion-router-outlet>
  </ion-split-pane>
</ion-app>

Angular 9/Ionic 5

I don’t see why you would need to see other files, but then again I cant figure out what’s wrong. So drop a line and I can share related files.

Source: Angular Questions