[英]Angular 6 Feature Modules : Interceptor not firing
我第一次使用功能模塊,無法啟動攔截器。 我是要素模型模式的新手,希望有人可以指出我的理解中的明顯錯誤。 攔截器稱為“ AuthenticationInterceptor”。 我將代碼粘貼在下面,非常感謝您的幫助。
我的代碼庫的結構如下:
/ app
app.module.ts
...
/dashboard
dashboard.module.ts
dashboard-routing.module.ts
dashboard.component.ts
...
/core
core.module.ts
...
/shared
shared.module.ts
....
應用模塊
import { NgModule } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { CoreModule } from './core/core.module'
import { SharedModule } from './shared/shared.module'
import { DashboardModule } from './dashboard/dashboard.module'
import { AppComponent } from './app.component';
import { AuthenticationInterceptor } from './core/interceptors/authentication.interceptor'
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
CoreModule,
BrowserAnimationsModule,
HttpClientModule,
AppRoutingModule,
CoreModule.forRoot(),
DashboardModule
],
exports: [
MaterialModule
],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: AuthenticationInterceptor,
multi: true
}
],
bootstrap: [AppComponent]
})
export class AppModule {}
應用程序路由模塊
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{
path: 'dashboard',
loadChildren: './dashboard/dashboard.module#DashboardModule'
},
{
path: '',
redirectTo: '',
pathMatch: 'full'
}
];
@NgModule({
imports: [
RouterModule.forRoot(routes, { useHash: true } )
],
exports: [
RouterModule
]
})
export class AppRoutingModule {}
共享模塊
import { NgModule, ModuleWithProviders } from '@angular/core'
import { CommonModule } from '@angular/common'
import { FormsModule, ReactiveFormsModule } from '@angular/forms'
@NgModule({
imports: [
CommonModule,
FormsModule,
],
declarations: [],
exports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
]
})
export class SharedModule {
static forRoot() {
return {
ngModule: SharedModule,
providers: []
}
}
}
核心模塊
import { NgModule, ModuleWithProviders, Optional, SkipSelf } from '@angular/core'
import { HttpModule } from '@angular/http'
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { AuthenticationInterceptor } from './interceptors/authentication.interceptor'
@NgModule({
imports: [
HttpModule,
HttpClientModule
]
})
export class CoreModule {
constructor(@Optional() @SkipSelf() parentModule: CoreModule) {
if (parentModule) {
throw new Error('CoreModule is already loaded. Import it in the AppModule only');
}
}
static forRoot(): ModuleWithProviders {
return {
ngModule: CoreModule,
providers: [
AuthenticationInterceptor
]
}
}
}
儀表板模塊
import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { SharedModule } from '../shared/shared.module'
import { AuthenticationInterceptor } from './../core/interceptors/authentication.interceptor'
import { DashboardRoutingModule } from './dashboard-routing.module'
import { DashboardComponent } from './dashboard.component'
@NgModule({
imports: [
CommonModule,
DashboardRoutingModule,
SharedModule,
],
declarations: [
DashboardComponent
],
exports: [
DashboardComponent
],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: AuthenticationInterceptor,
multi: true
}
]
})
export class DashboardModule { }
儀表板布線模塊
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { DashboardComponent } from './dashboard.component';
import { AuthenticationGuard } from './../core/guards/authentication.guard';
const routes: Routes = [
{
path: '',
component: DashboardComponent,
canActivate: [
AuthenticationGuard
]
}
];
@NgModule({
imports: [
RouterModule.forChild(routes)
],
exports: [
RouterModule
]
})
export class DashboardRoutingModule {}
如果每次為功能模塊導入HttpClientModule
,那么對於模塊的每個實例,都會有一個新的HttpClientModule
實例。 這就是您的攔截器不起作用的原因。 僅在app.module.ts
導入HttpClientModule
,它將攔截所有HTTP請求。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.