Angular - 类型 'OperatorFunction' 的参数不可分配给类型 'OperatorFunction' 的参数

Question

在我的 Angular-12 应用程序中，我在服务中有以下代码:

 constructor(private http: HttpClient, private router: Router) {
   var currentUser = JSON.parse(localStorage.getItem('user')|| '{}');
  this.token = currentUser && currentUser.token;
}

  public getAllCountries(): Observable<any> {
    const httpOptions = {
      headers: new HttpHeaders({
        "Content-Type": 'application/json',
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Headers": "Origin, Authorization, Content-Type, Accept",
        "Authorization" : "Bearer " + this.token
      })
    };

    return this.http.get(this.apiUrl  + '/fetchCountries', httpOptions )
        .pipe(
            map((response: Response) => {
                return response;
            })
        );
  }

此行被突出显示:

map((response: Response) => {

return response;

然后我得到这个错误:

Argument of type 'OperatorFunction<Response, Response>' is not assignable to parameter of type 'OperatorFunction<Object, Response>'.
  The 'Object' type is assignable to very few other types. Did you mean to use the 'any' type instead?
    Type 'Object' is missing the following properties from type 'Response': headers, ok, redirected, status, and 12 more.ts(2345)

如何解决？

谢谢

Answer 1

您正在使用 Response，它也已被弃用，如果我没记错的话，它在我们使用 Http 时被使用过，例如 angular 4 之前的版本。 HttpClient...它返回一个通用对象，就像错误也说的那样。相反，您应该将数据键入接口(interface)并告诉 HttpClient 您正在接收什么。假设你得到一个数组，那么像这样的东西应该可以工作:

export interface Country {
  // whatever properties your response has
}

然后告诉 HttpClient 您期望的响应是一个 Country 数组。此外，您实际上并不需要此处的 map，因为您没有以任何方式修改数据......所以这就足够了:

return this.http.get<Country[]>(this.apiUrl  + '/fetchCountries', httpOptions)

请始终引用官方文档以获取最新文档:https://angular.io/guide/http