Question

我想制作一个有3个组件的延迟加载模块。主要是Auth组件（以及signIn和signOut组件）。因此，我进行了延迟加载，并延迟加载了模块，但是我无法在auth组件中定义router-outlet标记以使子路由正常工作。

import {NgModule} from '@angular/core';
import {Routes, RouterModule} from '@angular/router';
import {AuthorizationModule} from './authorization/authorization.module';

const routes: Routes = [
  {path: 'auth', loadChildren: () => AuthorizationModule}
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {
}

import {NgModule} from '@angular/core';
import {RouterModule, Routes} from '@angular/router';
import {SignUpComponent} from './sign-up/sign-up.component';
import {SignInComponent} from './sign-in/sign-in.component';
import {AuthComponent} from './auth/auth.component';


const routes: Routes = [
  {
    path: '', component: AuthComponent, children: [
      {path: 'signIn', component: SignInComponent},
      {path: 'signUp', component: SignUpComponent}
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})

export class AuthRoutingModule {
}

Answer 1

将AuthRoutingModule导入您的AuthorizationModule

@NgModule({
  
  imports: [
    AuthRoutingModule // Add this statement
  ]
})
export class AuthorizationModule{ }

Answer 2

无论如何，您都没有在AppRoutingModule

中提供所使用的Angle版本。

const routes: Routes = [ {
           path: 'auth', 
           loadChildren:  () => import('./path/to/your/auth/module/ts/file').then((m: AuthModule) => m.AuthModule)
       }
];

角度：无法在延迟加载的模块组件中定义路由器出口：

2 个答案: