问Angular 5中的路由问题

EN

const routes: Routes = [
    { path: '', loadChildren: './login/login.module#LoginModule' },
    { path: 'dashboard', loadChildren: './layout/dashboard/dashboard.module#DashboardModule' },
    { path: 'layout', loadChildren: './layout/layout.module#LayoutModule', canActivate: [AuthGuard] },
    { path: 'login', loadChildren: './login/login.module#LoginModule' },
    { path: 'signup', loadChildren: './signup/signup.module#SignupModule' },
    { path: 'error', loadChildren: './server-error/server-error.module#ServerErrorModule' },
    { path: 'access-denied', loadChildren: './access-denied/access-denied.module#AccessDeniedModule' },
    { path: 'not-found', loadChildren: './not-found/not-found.module#NotFoundModule' },
    { path: '**', redirectTo: 'not-found' }
];

login(email: string, password: string) {
        console.log(email);
        this.firebaseAuth
        .auth
        .signInWithEmailAndPassword(email, password)
        .then(value => {
            console.log('Nice, it worked!');
            this.router.navigate(['/layout']);
        })
      .catch(err => {
           console.log('Something went wrong:',err.message);
      });


   }

const routes: Routes = [
    {
        path: '',
        component: LayoutComponent,
        children: [
            { path: '', redirectTo: 'dashboard' },
            { path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule' },
            { path: 'charts', loadChildren: './charts/charts.module#ChartsModule' },
   ]
    }
];

@NgModule({
    imports: [
        CommonModule,
        LayoutRoutingModule,
        TranslateModule,
        NgbDropdownModule.forRoot()
    ],
    declarations: [LayoutComponent, SidebarComponent, HeaderComponent]
})
export class LayoutModule {}

<app-header></app-header>
<app-sidebar></app-sidebar>
<section class="main-container">
    <router-outlet></router-outlet>
</section>