从角度 4 升级到 7 会导致一些问题

Question

嘿，我已将我的项目从 angular 4 升级到 angular 7，并且不推荐使用某些服务、模块。 这是我的 app.module.ts

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    SharedModule,
    HttpClientModule,
    AppRoutingModule,
    NgbModule.forRoot(),
    StoreModule.forRoot({})
  ],
  providers: [
    SessionTimeoutService,
    SpinnerService,
    {
      provide: HttpClient,
      useFactory: httpFactory,
      deps: [XHRBackend, RequestOptions, Store, SpinnerService]
    },
    UtilService,
    { provide: NgbDateParserFormatter, useClass: DateParserFormatter }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(private injector: Injector) {
    ServiceLocatorService.injector = this.injector;
  }
}

现在 XHRBackend，RequestOptions 现在已弃用并给我错误 谁能告诉我怎么解决？

这是我的 Http 拦截器文件

@Injectable()
export class InterceptedHttp extends HttpClient {
  constructor(
    backend: HttpBackend,
    defaultOptions: RequestOptions,
    private store: Store<any>,
    private spinnerService: SpinnerService
  ) {
    super(backend, defaultOptions);
  }

  request(
    url: string | HttpRequest,
    options?: RequestOptionsArgs
  ): Observable<HttpResponse> {
    this.showLoader();
    return this.tryCatch(super.request(url, options)).finally(() => {
      this.hideLoader();
    });
  }

  get(url: string, options?: RequestOptionsArgs): Observable<HttpResponse> {
    url = this.updateUrl(url);
    return this.tryCatch(super.get(url, this.getRequestOptionArgs(options)));
  }

  post(
    url: string,
    body: string,
    options?: RequestOptionsArgs
  ): Observable<HttpResponse> {
    url = this.updateUrl(url);
    return this.tryCatch(
      super.post(url, body, this.getRequestOptionArgs(options))
    );
  }

  put(
    url: string,
    body: string,
    options?: RequestOptionsArgs
  ): Observable<HttpResponse> {
    url = this.updateUrl(url);
    return this.tryCatch(
      super.put(url, body, this.getRequestOptionArgs(options))
    );
  }

  delete(url: string, options?: RequestOptionsArgs): Observable<HttpResponse> {
    url = this.updateUrl(url);
    return this.tryCatch(super.delete(url, this.getRequestOptionArgs(options)));
  }

  patch(
    url: string,
    body: any,
    options?: RequestOptionsArgs
  ): Observable<HttpResponse> {
    url = this.updateUrl(url);
    return this.tryCatch(
      super.patch(url, body, this.getRequestOptionArgs(options))
    );
  }

  private updateUrl(req: string) {
    return environment.origin + req;
  }

  private getRequestOptionArgs(
    options?: RequestOptionsArgs
  ): RequestOptionsArgs {
    if (options == null) {
      options = new RequestOptions();
    }
    if (options.headers == null) {
      options.headers = new HttpHeaders();
    }
    options.headers.append("Content-Type", "application/json");
    options.headers.append(
      "Authorization",
      ` Bearer ${sessionStorage.AccessToken}`
    );

    return options;
  }
}

我收到错误 请求选项， 请求选项参数， 这些已被弃用，现在我收到错误如何解决？

Answer 1

你必须使用来自@angular/common/http 的新包 喜欢

import { HttpClientModule } from "@angular/common/http";
import { HttpClient } from "@angular/common/http";

所以大多数情况下，您将使用 HttpHeaders 来构建您的 ajax 标头，例如 params formdata 等...

标题 -> HttpHeaders

响应 -> HttpResponse

RequestOptions, RequestOptionsArgs 被移除，你必须使用 HttpParams

请阅读新的更改日志here