首页 > 解决方案 > 错误:没有重载匹配此调用。重载 1 of 5... Angular 12

问题描述

以下是我的代码:

import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { BehaviorSubject } from 'rxjs';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class AuthService {

  isAuth$ = new BehaviorSubject<boolean>(false);
  token!: string ; 
  userId!: string;

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

    
  createNewUser(email: string, password: string) {
    return new Promise<void>((resolve, reject) => {
      this.http.post(
        'http://localhost:3000/api/auth/signup',
        { email: email, password: password })
        .subscribe(
          () => {
            this.login(email, password).then(
              () => {
                resolve();
              }
            ).catch(
              (error) => {
                reject(error);
              }
            );
          },
          (error) => {
            reject(error);
          }
        );
    });
  }

  login(email: string, password: string) {
    return new Promise<void>((resolve, reject) => {
      this.http.post(
        'http://localhost:3000/api/auth/login',
        { email: email, password: password })
        .subscribe(
          (authData: { token: string, userId: string }) => {  //====> Error 
            this.token = authData.token;
            this.userId = authData.userId;
            this.isAuth$.next(true);
            resolve();
          },
          (error) => {
            reject(error);
          }
        );
    });
  }

  logout() {
    this.isAuth$.next(false);
    this.userId = null!;
    this.token = null!;
  }
}

错误描述:

没有重载匹配此调用。重载 1 of 5, '(next: null, error: (error: any) => void, complete?: () => void): Subscription',给出以下错误。'(authData: { token: string; userId: string;}) => void' 类型的参数不可分配给'null' 类型的参数。
重载 2 of 5, '(next?: (value: Object) => void, error?: (error: any) => void, complete?: () => void): Subscription',给出以下错误。'(authData: { token: string; userId: string;}) => void' 类型的参数不可分配给'(value: Object) => void' 类型的参数。参数“authData”和“value”的类型不兼容。“对象”类型可分配给极少数其他类型。您的意思是改用“任何”类型吗?类型“对象”缺少类型“{ token: string; 中的以下属性;用户ID:字符串;}':令牌,用户ID

以下是我的代码

错误描述:

标签: angulartypescriptangular12

解决方案


您必须指定预期接收的响应数据类型this.http.post

解决方案 1:指定为{ token: string, userId: string }类型

login(email: string, password: string) {
    return new Promise<void>((resolve, reject) => {
      this.http.post<{ token: string, userId: string }>(
        'http://localhost:3000/api/auth/login',
        { email: email, password: password })
        .subscribe(
          (authData: { token: string, userId: string }) => { 
            this.token = authData.token;
            this.userId = authData.userId;
            this.isAuth$.next(true);
            resolve();
          },
          (error) => {
            reject(error);
          }
        );
    });
  }

解决方案 2:指定为any类型

login(email: string, password: string) {
    return new Promise<void>((resolve, reject) => {
      this.http.post<any>(
        'http://localhost:3000/api/auth/login',
        { email: email, password: password })
        .subscribe(
          (authData: { token: string, userId: string }) => { 
            this.token = authData.token;
            this.userId = authData.userId;
            this.isAuth$.next(true);
            resolve();
          },
          (error) => {
            reject(error);
          }
        );
    });
  }

推荐阅读