错误 TS2769：没有与此调用匹配的重载。在 angular 中实施模型时

Question

我运行在 angular 中实施模型时遇到错误：

component.ts:

import { Component, OnInit } from '@angular/core';
import { DamageAssessmentReportService } from 'src/app/damage-assessment-report.service';
import { Router } from '@angular/router';
import { Report } from 'src/app/models/report.model';

@Component({
  selector: 'app-fa-daform',
  templateUrl: './fa-daform.component.html',
  styleUrls: ['./fa-daform.component.css']
})
export class FADAFormComponent implements OnInit {


  constructor(private damageAssessmentReportService : DamageAssessmentReportService, private router: Router) { }

  createDamageAssessmentReport(assessmentDescription: string, author: string, reportDateString: string){

    const reportDateTime = new Date(reportDateString);
    this.damageAssessmentReportService.createDAReport(assessmentDescription,author, reportDateTime).subscribe((report : Report)=>{
      console.log(report);
      //navigate to /damageAssessments/damageAssessments._id
      this.router.navigate(['/detailed-daforms', report._id])
  })
  }

  
  ngOnInit(): void {
  }

  }

和 model.ts:

export class Report{
    _id: string ="";
    assessmentDescription: string = "";
    author: string = "";
    reportDateTime: Date = new Date("");
}

出现的错误：

error TS2769: No overload matches this call. Overload 1 of 3, '(observer?: Partial<Observer> | undefined): Subscription', gave the following error. Type '(report: Report) => void' has no properties in common with type 'Partial<Observer>'. Overload 2 of 3, '(next: (value: Object) => void): Subscription', gave the following error. Argument of type '(report: Report) => void' is not assignable to parameter of type '(value: Object) => void'. Types of parameters 'report' and 'value' are incompatible. 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 'Report': _id, assessmentDescription, author, reportDateTime
Overload 3 of 3, '(next?: ((value: Object) => void) | null | undefined, error?: ((error: any) => void) | null | undefined, complete?: (() => void) | null | undefined): Subscription', gave the following error. Argument of type '(report: Report) => void' is not assignable to parameter of type '(value: Object) => void'. Types of parameters 'report' and 'value' are incompatible. Type 'Object' is not assignable to type 'Report'. The 'Object' type is assignable to very few other types. Did you mean to use the 'any' type instead?

22
this.damageAssessmentReportService.createDAReport(assessmentDescription,author, reportDateTime).subscribe((report : Report)=>{
                                     ~~~~~~~~~~~~~~~~~~~~
× Failed to compile.

来自 DamageAssessmentReportService 的 createDAReport 方法

createDAReport(assessmentDescription: string, author: string, reportDateTime: Date){
    //send web req to create DA report
    return this.webReqService.post('DamageAssessments', {assessmentDescription, author, reportDateTime})
  }

webReqService:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

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

  readonly ROOT_URL;

  constructor(private http: HttpClient) {
    this.ROOT_URL= 'http://localhost:3000';
  }
  
  get(uri: string) {
    return this.http.get(`${this.ROOT_URL}/${uri}`)
  }

post(uri: string, payload: Object) { return this.http.post(${this.ROOT_URL}/${uri}, 有效负载); }

补丁（uri：字符串，有效载荷：对象）{ return this.http.patch(${this.ROOT_URL}/${uri}, 负载); }

删除（uri：字符串）{ return this.http.delete(${this.ROOT_URL}/${uri}); }

}

Answer 1

从现有的代码和错误信息来看，因为你想获得 T 的 Observable，建议你通过指定 T 类型为 Angular - HttpClient (Post) 使用 Overload #15。

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

WebRequestService

您可以通过使用函数重载来执行与 Angular handle for HttpClient methods 类似的操作。

post<T>(uri: string, payload: Object): Observable<T>;
post(uri: string, payload: Object): Observable<any> {
  return this.http.post<any>(`${this.ROOT_URL}/${uri}`, payload);
}

DamageAssessmentReportService

createDAReport(assessmentDescription: string, author: string, reportDateTime: Date): Observable<Report>{
  //send web req to create DA report
  return this.webReqService.post<Report>('DamageAssessments', {assessmentDescription, author, reportDateTime})
}

错误 TS2769：没有与此调用匹配的重载。在 angular 中实施模型时

error TS2769: No overload matches this call. when implementing a model in angular

angular

typescript

mean-stack