Angled Routes 2+

My application starts in the component Login component:

bootstrap: [LoginComponent]

In my login routing module I defined the following routes:

const loginRoutes: Routes = [
  {path: 'dash', component: DashboardComponent},
  {path: 'registrar', component: RegistrarComponent},
];

@NgModule({
  imports:[RouterModule.forRoot(loginRoutes)],
  exports: [RouterModule]
})

Dash should be accessed when the user logs in;

In my login.component.html I set an ngIf that will only show the dash when the user logs into the system:

<div *ngIf="!usuarioautenticou" class="wrapper">

In this template I defined the router-outlet and buttons for navigation calls:

<div>
     <button type="submit" routerLink="/dash" name="entrar" (click)="fazerLogin()" class="btn btn-success waves-effect" id="login-button">Entrar</button>
     <button type="button" routerLink="/registrar" class="btn btn-outline-success waves-effect">Registrar</button>
</div>
<router-outlet></router-outlet>

Everything works perfectly for now. When the application is on localhost: 4200 it redirects to the login page. When you click register it changes to the registry component and when I click on it it moves me to the dash screen.

The problem is that the dash is a fixed component that inside it will have other components, so I tried to put another router-outlet inside the dash:

   <router-outlet></router-outlet>

dashboard.routing.module.ts:

const dashboardRoutes: Routes = [
  { path: '', component: BemvindoComponent },
];

However, the BemVindoComponent does not appear inside my dash. It is already as exports and is imported by my dash routes module.