嘿,我刚刚尝试在我的应用程序中设置模块的延迟加载,但我收到此错误,我正在遵循教程,但显然他们没有收到相同的错误
我的设置如下
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, Routes, ActivatedRoute, ParamMap } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';
import { environment } from '../environments/environment';
import { ServiceWorkerModule } from '@angular/service-worker';
import { OurWorkModule } from './our-work/our-work.module';
import { ourWorkRouting } from './our-work/our-work-routing.module';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { FooterComponent } from './shared/footer/footer.component';
import { WhatWeDoComponent } from './what-we-do/what-we-do.component';
import { HeaderComponent } from './shared/header/header.component';
import { OurProcessComponent } from './our-process/our-process.component';
import { OurTechnologyComponent } from './our-technology/our-technology.component';
import { GetInTouchComponent } from './get-in-touch/get-in-touch.component';
export const ROUTES: Routes = [
{ path: '', component: HomeComponent, pathMatch: 'full' },
{ path: 'what-we-do', component: WhatWeDoComponent},
{ path: 'our-work', loadChildren: 'app/our-work/our-work.module#OurWorkModule' },
{ path: 'our-technology', component: OurTechnologyComponent},
{ path: 'get-in-touch', component: GetInTouchComponent },
{ path: '**', redirectTo: ''}
];
@NgModule({
declarations: [
AppComponent,
HomeComponent,
FooterComponent,
WhatWeDoComponent,
HeaderComponent,
OurProcessComponent,
OurTechnologyComponent,
GetInTouchComponent,
HeaderHomeComponent,
],
imports: [
BrowserModule,
LazyLoadImageModule,
RouterModule.forRoot(ROUTES),
FormsModule,
HttpModule,
HttpClientModule,
ourWorkRouting,
OurWorkModule,
environment.production ? ServiceWorkerModule.register('/ngsw-worker.js') : [],
],
providers: [EmailService],
bootstrap: [AppComponent]
})
export class AppModule { }
our-work-module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule, Routes, ActivatedRoute, ParamMap } from '@angular/router';
import { OurWorkComponent } from './our-work.component';
@NgModule({
imports: [
CommonModule,
RouterModule
],
declarations: [
OurWorkComponent,
]
})
export class OurWorkModule {}
our-work-routing.module.ts
import { Routes, RouterModule } from '@angular/router';
import { OurWorkComponent } from './our-work.component';
const ourWorkRoutes: Routes = [
{ path: '', component: OurWorkComponent }
];
export const ourWorkRouting = RouterModule.forChild(ourWorkRoutes);
这是我第一次尝试延迟加载模块或设置功能模块,因此我们将不胜感激!
谢谢
最佳答案
这是我的延迟加载模块的样子,希望对您有帮助
import { NgModule, ApplicationRef, APP_BOOTSTRAP_LISTENER, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { APP_BASE_HREF, CommonModule } from '@angular/common';
import { Http, HttpModule } from "@angular/http";
import { RouterModule } from '@angular/router';
import { FormsModule } from '@angular/forms';
import { OurWorkComponent } from './our-work.component';
@NgModule({
declarations: [
OurWorkComponent
],
imports: [
CommonModule,
FormsModule,
HttpModule,
RouterModule.forChild([
{ path: '', component: OurWorkComponent }
])
],
providers : [
//add services and other providers
],
schemas: [ NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA ]
})
export class FeaturedModule { }
我认为您没有在 our-work-module.ts
中添加 ourWorkRouting
关于javascript - 范围错误: Maximum call stack size exceeded Angular 5 Router,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48554772/