Angular 7, Public routes and Secure routes that share the same Nav template

Question

What I wish to achieve is a public routes outlet and a secure routes outlet, but have them both use the same nav template.

I'm not sure how to execute this. I know that you can name outlets, but don't know if that's what needs done?

app-routing.module.ts

export const PUBLIC_ROUTES: Routes = [
 { path: '', redirectTo: 'home', pathMatch: 'full' },
  ...
]

export const SECURE_ROUTES: Routes = [
 { path: '', redirectTo: 'home', pathMatch: 'full' },
  ...
]

const routes: Routes = [

 { path: '', component: PublicComponent, data: { title: 
 'Public Views' }, children: PUBLIC_ROUTES },
 { path: '', component: SecureComponent, data: { title: 
 'Secure Views' }, children: SECURE_ROUTES },

 //no layout routes
 { path: 'login', component: LoginComponent },
 //{ path: 'register', component: RegisterComponent },
 { path: '**', component: FileNotFoundComponent }
];

public.component.html

<main-header [navComp]="nav"></main-header>
<main-nav #nav></main-nav>

<div id="main-content" [class.hideNav]="isOpen">
  <main [@fadeAnimation]="getRouterOutletState(o)">
    <router-outlet #o="outlet"></router-outlet>
  </main>
</div>

secure.component.html

<main-header [navComp]="nav"></main-header>
<main-nav #nav></main-nav>

<div id="main-content" [class.hideNav]="isOpen">
  <main [@fadeAnimation]="getRouterOutletState(o)">
    <router-outlet #o="outlet"></router-outlet>
  </main>
</div>

What I was going to try to do...

layout.component.html

<main-header [navComp]="nav"></main-header>
<main-nav #nav></main-nav>

<div id="main-content" [class.hideNav]="isOpen">
  <main [@fadeAnimation]="getRouterOutletState(o)">
    <router-outlet #o="outlet" name="public"></router-outlet>
    <router-outlet #o="outlet" name="secure"></router-outlet>
  </main>
</div>

and

const routes: Routes = [

  { path: '', component: PublicComponent, outlet: 'public', data: { title: 'Public Views' }, children: PUBLIC_ROUTES },
  { path: '', component: SecureComponent, outlet: 'secure', data: { title: 'Secure Views' }, children: SECURE_ROUTES },

  //no layout routes
  { path: 'login', component: LoginComponent },
  //{ path: 'register', component: RegisterComponent },
  { path: '**', component: FileNotFoundComponent }
];

but, now don't know where to point to layout.component.html?

Gotta be close, but I'm missing something still?