Question

我正在使用Angular 5.2.10并尝试将应用程序设置为延迟加载。为AuditorloginComponent创建新模块，我已从AuditorloginComponent

中删除了app.module.ts

auditorlogin.module.ts

@NgModule({
  imports: [
    CommonModule,
    AuditorloginRoutingModule,FormsModule
  ],
  declarations: [AuditorloginComponent]
})
export class AuditorloginModule { }

auditorlogin-routing.module.ts

const routes: Routes = [
  { 
    path: '',
    component: AuditorloginComponent
}
];

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

app.routing.ts

我添加了loadChildren

 {
    path: 'auditorlogin',
    loadChildren: 'app/auditor/auditorlogin/auditorlogin-routing.module#AuditorloginRoutingModule',
    pathMatch: 'full'
  },

但我得到了

core.js:1449 ERROR Error: Uncaught (in promise): Error: Component AuditorloginComponent is not part of any NgModule or the module has not been imported into your module.

Error: Component AuditorloginComponent is not part of any NgModule or the module has not been imported into your module

请告诉我，我的错误在哪里？

Answer 1

您没有AuditorloginRoutingModule declarations:[...]

中的组件

Answer 2

您的问题出在AuditorloginRoutingModule。你必须像这样添加AuditorloginComponent这个

const routes: Routes = [
  { 
    path: '',
    component: AuditorloginComponent
}
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
  declarations: [
    // components that are used will be added here.
    AuditorloginComponent]
})
export class AuditorloginRoutingModule { }

Answer 3

你只是懒得加载路由模块，而你应该加载AuditorloginModule，然后使用AuditorloginRoutingModule进行路由，而不是相反。

{
    path: 'auditorlogin',
    loadChildren: 'app/auditor/auditorlogin/auditorlogin.module#AuditorloginModule',
    pathMatch: 'full'
},

Answer 4

将 AuditorloginModule 更改为

@NgModule({
  imports: [
    CommonModule,
    AuditorloginRoutingModule,FormsModule
  ],
  declarations: [AuditorloginComponent],
  export: [AuditorloginComponent]
})
export class AuditorloginModule { }

然后将 AuditorloginComponent 声明为您要在其中使用的任何模块。

Answer 5

确保将组件导入到app-routing.module.ts中。就我而言，这就是原因我忘了把零件包括在减速中

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    IndexComponent
  ],
  imports: [
    BrowserModule, FormsModule, HttpClientModule, RouterModule.forRoot(routes)
  ],
  exports: [RouterModule],
  providers: [],
  bootstrap: [AppComponent]
})

还要确保在添加新模块和组件时重新启动服务器，而这会在发生此问题时重新启动。因此，基本的解决方案是退出服务器，然后再次提供服务。

Angular Lazy Loading（模块尚未导入模块）

5 个答案: