我正在尝试将Lazy Loading实现到我的应用程序中,但似乎遇到了一个问题,我收到错误消息:
Error: RouterModule.forRoot() called twice. Lazy loaded modules should
use RouterModule.forChild() instead.
所以我有我的主app-routing.module.ts以及app-module.ts,如下所示:
APP-module.ts
// External Dependencies import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { HttpClientModule } from '@angular/common/http'; import { FormsModule,ReactiveFormsModule } from '@angular/forms'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; // Internal Dependencies import { MaterialModule } from '../app/configuration/material/material.module'; import { SharedModule } from '../app/application/shared/shared.module'; import { RoutingModule } from '../app/configuration/routing/routing.module'; import { SettingsModule } from '../app/application/settings/settings.module'; import { AppComponent } from './app.component'; import { SearchService } from './application/shared/services/search.service'; @NgModule({ declarations: [AppComponent],imports: [ BrowserAnimationsModule,BrowserModule,SharedModule,RoutingModule,MaterialModule,HttpClientModule,FormsModule,],providers: [ ],bootstrap: [AppComponent] }) export class AppModule { }
APP-routing.ts
// External Dependencies import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { RouterModule,Routes } from '@angular/router'; import { HttpModule } from '@angular/http'; const appRoutes: Routes = [ { path: '',redirectTo: 'overview',pathMatch: 'full' },{ path: 'overview',loadChildren: '../../application/overview/overview.module#OverviewModule' },{ path: 'search',loadChildren: '../../application/search/search.module#SearchModule' },{ path: 'policy/:id',loadChildren: '../../application/policy/policy.module#PolicyModule' },{ path: 'claim/:id',loadChildren: '../../application/claim/claim.module#ClaimModule' },{ path: 'settings',loadChildren: '../../application/settings/settings.module#SettingsModule' } ]; @NgModule({ imports: [ CommonModule,RouterModule.forRoot(appRoutes) ],exports: [ RouterModule ],declarations: [] }) export class RoutingModule { }
这工作正常,应用程序正确加载.这里的问题是,在SharedModule中,组件将使用routerLink将用户重定向到新页面.
shared.module.ts
// External Dependencies import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule,ReactiveFormsModule } from '@angular/forms'; import { CalendarModule } from 'primeng/calendar'; import { AgmCoreModule } from '@agm/core'; import { FroalaEditorModule,FroalaViewModule } from 'angular-froala-wysiwyg'; import { PdfViewerModule } from 'ng2-pdf-viewer'; // Internal Dependencies import { MaterialModule } from '../../configuration/material/material.module'; import { RoutingModule } from '../../configuration/routing/routing.module'; import { NavbarTopComponent } from '../../application/shared/components/navbar-top/navbar-top.component'; import { NavbarSideComponent } from './components/navbar-side/navbar-side.component'; import { TemplateCardWComponent } from './components/template-card-w/template-card-w.component'; import { FilterPipe } from './pipes/filter.pipe'; import { StandardTableComponent } from './components/standard-table/standard-table.component'; import { OrderPipe } from '../shared/pipes/order.pipe'; import { ActionComponent } from './components/action/action.component'; import { GoogleMapComponent } from './components/google-map/google-map.component'; import { HtmlEditorComponent } from './components/html-editor/html-editor.component'; import { PdfViewerComponent } from './components/pdf-viewer/pdf-viewer.component'; import { KeyBindingPipe } from './pipes/key-binding.pipe'; import { StandardEditTableComponent } from './components/standard-edit-table/standard-edit-table.component'; @NgModule({ imports: [ CommonModule,CalendarModule,AgmCoreModule,FroalaEditorModule,FroalaViewModule,PdfViewerModule ],declarations: [ NavbarTopComponent,NavbarSideComponent,TemplateCardWComponent,FilterPipe,StandardTableComponent,OrderPipe,ActionComponent,GoogleMapComponent,HtmlEditorComponent,PdfViewerComponent,KeyBindingPipe,StandardEditTableComponent ],exports: [ ] }) export class SharedModule { }
如您所见,我必须导入RouterModule.如果我删除了RouterModule,应用程序将加载但不重定向.如果我保留RouterModule,应用程序将导致问题顶部的错误.
任何人都可以帮我这个.