Angular - 'OperatorFunction<IUser, void>' 类型的参数不可分配给'OperatorFunction<Object, void>' 类型的参数答案

【问题标题】：Angular - Argument of type 'OperatorFunction<IUser, void>' is not assignable to parameter of type 'OperatorFunction<Object, void>'Angular - 'OperatorFunction<IUser, void>' 类型的参数不可分配给'OperatorFunction<Object, void>' 类型的参数
【发布时间】：2021-12-23 09:48:29
【问题描述】：

当我尝试在 Angular-13 中创建用户登录时，我有这个模型：

export interface IUser {
   email: string;
   token: string;
}

服务：

export class AccountService {
  baseUrl = environment.apiUrl;
  private currentUserSource = new ReplaySubject<IUser>(1);
  currentUser$ = this.currentUserSource.asObservable();

  constructor(private http: HttpClient, private router: Router) { }

  login(values: any) {
      return this.http.post(this.baseUrl + 'account/login', values).pipe(
        map((user: IUser) => {
          if (user) {
            localStorage.setItem('token', user.token);
            this.currentUserSource.next(user);
          }
        })
      );
    }
}

我在尝试实现它时遇到了这个错误：

“OperatorFunction”类型的参数不可分配给“OperatorFunction

突出显示：

地图（（用户：IUser）=> {

我该如何解决这个问题？

谢谢

【问题讨论】：

您可以尝试使用 any 代替 IUser，这不是解决方法，只是为了了解问题是否出在地图上？

标签： angular typescript angular-httpclient

【解决方案1】：

如您所料，您返回的响应是IUser 类型，然后将T 指定为IUser 类型。

post<T>(url: string, body: any, options?: { headers?: HttpHeaders | { [header: string]: string | string[]; }; context?: HttpContext; observe?: "body"; params?: HttpParams | { [param: string]: string | number | boolean | ReadonlyArray<string | number | boolean>; }; reportProgress?: boolean; responseType?: "json"; withCredentials?: boolean; }): Observable<T>

login(values: any) {
  return this.http.post<IUser>(this.baseUrl + 'account/login', values).pipe(
    map((user: IUser) => {
      ...
    })
  );
}

Sample Demo on StackBlitz

参考文献

HttpClient post() Overload #15

【讨论】：