提供者不能进行静态分析-从8迁移到Angular 9

时间:2020-05-27 06:06:37

标签: javascript angular typescript node-modules angular-module

将项目从Angular 8迁移到Angular 9时,我收到以下消息。

Missing @Injectable and incomplete provider definition migration.
  In Angular 9, enforcement of @Injectable decorators for DI is a bit stricter and incomplete provider definitions behave differently.
  Read more about this here: https://v9.angular.io/guide/migration-injectable
    Could not migrate all providers automatically. Please
    manually migrate the following instances:
    ⮑   src/app/app.module.ts@105:43: Provider is not statically analyzable.
  Migration completed.

在运行ng serve命令时,出现以下错误

ERROR in ./src/app/http-interceptors/response-error.interceptor.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: /src/app/http-interceptors/response-error.interceptor.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:933:23)
    at plugin.done.then (/node_modules/@ngtools/webpack/src/loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)

已添加以下代码以供参考。

app.module.ts

import { httpInterceptorProviders } from './http-interceptors';
import { ServerRequestConfigService } from './shared/server-request-config.service';
import { APP_BASE_HREF } from '@angular/common';
import { getBaseLocation } from './shared/share.service';

providers: [ServerRequestConfigService, httpInterceptorProviders, {
  provide: APP_BASE_HREF,
  useFactory: getBaseLocation
}],

文件夹结构
http-interceptor
-index.js
-response-error.interceptor.ts

index.js

import { HTTP_INTERCEPTORS } from '@angular/common/http';

import { ResponseErrorInterceptor } from './response-error.interceptor';
import { NbToastrService } from '@nebular/theme';
import { AuthService } from '../auth/auth.service';
import { ShareService } from '../shared/share.service';

/** Http interceptor providers in outside-in order */
export const httpInterceptorProviders = [
  { provide: HTTP_INTERCEPTORS, useClass: ResponseErrorInterceptor, multi: true, deps: [NbToastrService, AuthService, ShareService] },
];

response-error.interceptor.ts

import { catchError } from 'rxjs/operators';

import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { HttpInterceptor, HttpRequest, HttpResponse, HttpHandler, HttpEvent, HttpErrorResponse } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { NbToastrService } from '@nebular/theme';
import { ShareService } from '../shared/share.service';
import { AuthService } from '../auth/auth.service';

@Injectable()
export class ResponseErrorInterceptor implements HttpInterceptor {
    constructor(private toastr: NbToastrService,
                private authService: AuthService,
                private shareService: ShareService,
                private router: Router) { }

    intercept(req: HttpRequest<any>, next: HttpHandler) {

        // extend server response observable with logging
        return next.handle(req).pipe(catchError((err) => {
            this.shareService.hideSpinner();
            if (err.status === 401) {
                this.toastr.danger('Please login again', 'Login Error');
                this.authService.logout();
                // this.router.navigate(['login']);
            } else if (err.status === 400) {
                this.toastr.danger('Please check the data', 'Server Data Error');
            } else if (err.status === 403) {
                // this.toastr.danger('Unauthorized, Please signin using authorized email', 'Forbidden');
                this.authService.logout();
                alert('Unauthorized, Please signin using authorized email');
            } else if (err.status === 404) {
                this.toastr.danger('Something went wrong, Please try again');
                // this.router.navigate(['loan-application']);
            } else if (err.status === 405) {
                this.toastr.danger('Something went wrong');
                this.router.navigate(['loan-application']);
            } else if (err.status === 500) {
                this.toastr.danger('Something went wrong, Please try again', 'Server Error');
            }
            return throwError(err);
        }));
    }
}

我应该如何将提供程序部分中的http-interceptor手动迁移到Angular 9?

0 个答案:

没有答案