提问人:Jacin Montava 提问时间:9/5/2023 最后编辑:Jacin Montava 更新时间:9/5/2023 访问量:41
NGPrime MessageServices 和 Interceptor 错误
Error with NGPrime MessageServices and Interceptor
问:
我已经处理这个问题一天半了,但我找不到解决方案。 我创建了一个拦截器来捕获 HTTP 调用中的错误消息,我希望它使用 PrimeNG MessageService 显示错误消息。
拦截器工作正常,但是当我调用MessageService时,出现以下错误:
TypeError:无法读取 undefined 的属性(读取“add”)
我已经尝试了一千种方法,但没有一种对我有用。
这是我的代码:
app.module.ts
import { HTTP_INTERCEPTORS, HttpClient, HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable, NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { JwtModule } from '@auth0/angular-jwt';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { AuthGuard } from './core/helpers/auth-guard';
import { RedirectInterceptor } from './core/interceptors/redirect.interceptor';
import { NotfoundComponent } from './demo/components/notfound/notfound.component';
import { AppLayoutModule } from './layout/app.layout.module';
import { HomePageComponent } from './shared/components/home-page/home-page.component';
import { MasterTableComponent } from './shared/components/master-table/master-table.component';
import { PrimeNgModule } from './shared/primeng.module';
import { MessageService } from 'primeng/api';
import { ErrorInterceptor } from './core/interceptors/error.interceptor';
import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { Router } from '@angular/router';
import { Observable, catchError, throwError } from 'rxjs';
export function tokenGetter() {
return localStorage.getItem("token");
}
export function HttpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http);
}
@Injectable()
export class ErrorInterceptor2 implements HttpInterceptor {
constructor(protected router: Router, private translate: TranslateService, private messageService: MessageService) { }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return next.handle(req).pipe(
catchError((err: HttpErrorResponse) => {
console.log(err.error.error)
this.messageService.add({ key:'error-notif', severity: 'error', summary: 'Error', detail: err.error.error });
console.log('message send');
/* let errorText = this.translate.get(err.error.error).subscribe((res: string) => {
console.log(res);
});
console.log(errorText); */
return throwError(() => err.error.error);
})
);
}
}
@NgModule({
declarations: [
AppComponent, NotfoundComponent, MasterTableComponent, HomePageComponent
],
imports: [
AppRoutingModule,
AppLayoutModule,
PrimeNgModule,
FormsModule,
JwtModule.forRoot({
config: {
tokenGetter: tokenGetter,
allowedDomains: ["localhost"],
},
}),
TranslateModule.forRoot({
defaultLanguage: 'es',
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
deps: [HttpClient]
}
})
],
exports: [
PrimeNgModule
],
providers: [
{ provide: LocationStrategy, useClass: HashLocationStrategy },
{ provide: HTTP_INTERCEPTORS, useClass: RedirectInterceptor, multi: true },
{ provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor2, multi: true, deps: [MessageService] },
AuthGuard,
MessageService
],
bootstrap: [AppComponent]
})
export class AppModule { }
应用组件:.html
<p-toast key="error-notif" position="top-left"></p-toast>
<router-outlet></router-outlet>```
答: 暂无答案
评论