属性 \'NUM\' 在类型 \'ListePrea\' 中缺失，但在类型 \'Toto\' 中是必需的答案

【问题标题】：Property 'NUM' is missing in type 'ListePrea' but required in type 'Toto'属性 \'NUM\' 在类型 \'ListePrea\' 中缺失，但在类型 \'Toto\' 中是必需的
【发布时间】：2022-12-26 09:22:36
【问题描述】：

我想从网络服务中检索数据。

我有一条错误消息：

“ListePrea”类型中缺少属性“NUM”，但在“Toto”类型中是必需的。

真诚地，我不明白这个问题，我仍然是 Angular 的初学者。

这是 JSON 结构

toto.service.ts

该服务与后端交互。 [没问题]

@Injectable()
export class TotoService {
    private readonly api: string = environment.api;
    num: string | null = null;

    constructor(private http: HttpClient, private datePipe: CphFormatDatePipe) {}

    getTransferDetails(num: string): Observable < TotoResponse > {
        return this.http.post < TotoResponse > (this.api + `/WAMCHOM`, {
            NUM: parseInt(num)

        }, );
    }

}

toto.response.ts

我觉得使用类是不正确的？ [有一个问题？]

export interface TotoResponse extends ApiResponse {

    PREA: ListePrea;
}

export interface ListePrea {
    PREA: {
        CLER: string;
        NUM: number;
        REF_RBC: string;
        TYPE: string;
        QUANTITE: number;
        ISIN: string;
        TRADE_DATE: Date;
        RECEPTION_DATE: Date;
        STATUT: number;
        LABEL: string;
        SVM: number;
        COURS_MOYEN_ACHAT: number;
        PERSONNE_CONTACT: string;
        TEL: number;
        FAX: number;
        DATE: Date;
        TRAITEMENT_DATE: Date;
        ANNULATION_DATE: Date;
        INTITULE1: string;
        CONTREPARTIE: string;      
        TIS: number;
        CHANGEMENT_BENEF_ECO: string;
        REM1: string;
        REM2: string;
    };
}


export class Toto {
    NUM: number | null = null;

    constructor(
        NUM: number | null = null,
    ) {
        this.NUM = NUM;
    }
}

toto.component.ts

我不明白为什么this.listPreas = res.PREA;行是错误的？ [问题]

export class TotoComponent implements OnInit, OnDestroy {


    private unsubscribe$ = new Subject < void > ();
    num: string | null = null;

    listPreas: Toto = new Toto(parseInt(this.num + ''));


    constructor(
        private service: TotoService,
        private createDateTimePipe: CreateDateTimePipe,
        private location: Location,
        private activatedRoute: ActivatedRoute
    ) {}

    ngOnInit(): void {
        this.num = this.activatedRoute.snapshot.paramMap.get('num');

        if (!this.num) {
            this.goBack();
            return;
        }
        this.getTransferDetails();
    }

    ngOnDestroy(): void {
        this.unsubscribe$.next();
        this.unsubscribe$.complete();
    }

    private getTransferDetails(): void {
        this.service.getTransferDetails(this.num!).pipe(
            takeUntil(this.unsubscribe$)
        ).subscribe(res => {
            if (res.RETURNCODE === ApiResponseCodeEnum.Ok) {
                this.listPreas = res.PREA;
            }
        });
    }

    goBack(): void {
        this.location.back();
    }

}

非常感谢您的帮助，我真的很想了解这个问题。

【问题讨论】：

标签： angular typescript

【解决方案1】：

创建Toto实例并从res.PREA.PREA.NUM获取值

this.listPreas = new Toto(res.PREA.PREA.NUM);

private getTransferDetails(): void {
    this.service.getTransferDetails(this.num!).pipe(
        takeUntil(this.unsubscribe$)
    ).subscribe(res => {
        if (res.RETURNCODE === ApiResponseCodeEnum.Ok) {
            this.listPreas = new Toto(res.PREA.PREA.NUM);
        }
    });
}

请注意，基于 TotoResponse 和 ListePrea，您的 JSON 应该是这样的：

{
    PREA: {
        PREA: {
            CLER: "",
            NUM: 1,
            // Following properties
        }
    }
}

存在属性名称为 PREA 的嵌套级别

【讨论】：