Angular 9.0 'router-outlet' 不是延迟加载模块中的已知元素答案

【问题标题】：Angular 9.0 'router-outlet' is not a known element in lazy loaded moduleAngular 9.0 'router-outlet' 不是延迟加载模块中的已知元素
【发布时间】：2020-07-27 04:08:33
【问题描述】：

我正在尝试为应用组件实现新的延迟加载模块，但是当我尝试为新模块添加子路由时

它抛出 'router-outlet' is not a known element:in lazy loaded module 错误。

我在子模块中导入和导出 RouterModule。

const routes: Routes = [
  {
    path: '',
    component: ProfileComponent,
    children: [
      {path: '', pathMatch: 'full', component: PostsComponent},
      {path: 'media', component: MediaComponent},
      {path: 'settings', component: SettingsComponent},
    ]
  }
];

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

和配置文件模块（我尝试实现的模块）我导入配置文件

@NgModule({
  declarations: [PostsComponent, MediaComponent, SettingsComponent],
  imports: [
    CommonModule,
    SharedModule,
    ProfileRoutingModule
  ]
})
export class ProfileModule {
}

和 AppRoutingModule 的一部分

{
   path: 'profile',
   loadChildren: () => import('./profile/profile.module')
     .then(m => m.ProfileModule)
}

其他模块工作得很好，但是当我尝试延迟加载模块时，它给了我这个错误

【问题讨论】：

你可以尝试删除RouterModule的导出吗？这可能会干扰活动的 RouterModule。我认为它不应该存在。
@Silvermind 还是一样

标签： angular

【解决方案1】：

我猜您忘记在您的AppRoutingModule 中导出RouterModule。 Stackblitz 重现错误：https://stackblitz.com/edit/angular-jd3ehv?file=src%2Fapp%2Fapp-routing.module.ts

@NgModule({
  imports: [
    RouterModule.forRoot([
      {
        path: "recipe",
        loadChildren: () =>
          import("./recipe/recipe.module").then(mod => mod.RecipeModule)
      }
    ])
  ],
  exports: [RouterModule] // <==== add this line
})
export class AppRoutingModule {}

【讨论】：

不，我正在导出模块。我发现了问题。在配置文件模块配置文件组件未声明。