[英]error TS2339: Property 'num' does not exist on type 'CustomerTransfert[]'
From a webService, I would like to display the data.从 webService,我想显示数据。
The error message is:错误信息是:
error TS2339: Property 'num' does not exist on type 'CustomerTransfert[]'.
enter image description here在此处输入图像描述
I share the JSON file with you, I would just like to display the value of the NUM
variable.我把JSON这个文件分享给大家,我只想显示
NUM
变量的值。
I made a console.log I recover the data我做了一个 console.log 我恢复了数据
enter image description here在此处输入图像描述
private getCustomerTransfert(): void {
this.service.getCustomerTransfert().pipe(
takeUntil(this.unsubscribe$)
).subscribe(res => {
console.log("Step 1");
this.customerTransferts = res.PREA.map(val => {
console.log("Result => " + JSON.stringify(res.PREA));
return {
cler: val.CLER,
num: val.NUM,
ref_rbc: val.REF_RBC,
type: val.TYPE,
quantite: val.QUANTITE,
isin: val.ISIN,
trade_date: val.TRADE_DATE,
reception_date: val.RECEPTION_DATE,
statut: val.STATUT,
label: val.LABEL,
}
});
});
}
The complete code完整代码
export class CustomerTransfertDetailsComponent implements OnInit, OnDestroy {
private unsubscribe$ = new Subject < void > ();
customerTransferts: CustomerTransfert[] = [];
constructor(private service: CustomerTransfertDetailsService, private http: HttpClient) { }
ngOnInit(): void {
this.getCustomerTransfert();
}
ngOnDestroy(): void {
this.unsubscribe$.next();
this.unsubscribe$.complete();
}
private getCustomerTransfert(): void {
this.service.getCustomerTransfert().pipe(
takeUntil(this.unsubscribe$)
).subscribe(res => {
console.log("Step 1");
this.customerTransferts = res.PREA.map(val => {
console.log("Result => " + JSON.stringify(res.PREA));
return {
cler: val.CLER,
num: val.NUM,
ref_rbc: val.REF_RBC,
type: val.TYPE,
quantite: val.QUANTITE,
isin: val.ISIN,
trade_date: val.TRADE_DATE,
reception_date: val.RECEPTION_DATE,
statut: val.STATUT,
label: val.LABEL,
}
});
});
}
goBack(): void {
}
}
My problem in HTML我的问题HTML
<div class="home-content">
<div class="container" *ngIf="customerTransferts">
<div class="pt-50">
<div class="breadcrumb d-flex justify-content-between border-bottom pb-3">
<h2>Détails d'un transfert </h2>
<button type="button" (click)="goBack()" class="btn btn-primary m-1 btnColor">Retour </button>
</div>
<div class="pt-3 container">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col">
<table class="table table-hover table-striped spaceLeft">
<tbody>
<tr>
<th>N° de préavis</th>
<td> {{ customerTransferts.num}} </td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
customer-transfert.response.ts客户转移.response.ts
import {
ApiResponse
} from "src/shared/types/api.response";
export interface CustomerTransfertResponse extends ApiResponse {
PREA: {
CLER: string;
NUM: number;
REF_RBC: string;
TYPE: string;
QUANTITE: number;
ISIN: string;
TRADE_DATE: Date;
RECEPTION_DATE: Date;
STATUT: number;
LABEL: string;
} [];
}
customer-transfert.ts客户转移.ts
export interface CustomerTransfert {
cler: string;
num: number;
ref_rbc: string;
type: string;
quantite: number;
isin: string;
trade_date: Date;
reception_date: Date;
statut: number;
label: string;
}
This is actually correct behavior.这实际上是正确的行为。 As per your codebase, the
根据您的代码库,
this.customerTransferts = res.PREA.map(val => {
console.log("Result => " + JSON.stringify(res.PREA));
return {
cler: val.CLER,
num: val.NUM,
ref_rbc: val.REF_RBC,
type: val.TYPE,
quantite: val.QUANTITE,
isin: val.ISIN,
trade_date: val.TRADE_DATE,
reception_date: val.RECEPTION_DATE,
statut: val.STATUT,
label: val.LABEL,
}
});
the customerTransferts
is an Array and not an individual object. customerTransferts
是一个数组而不是一个单独的 object。
Also, you can see in the error as well, that the num
does not exists on type CustomerTransfert[]
(This is an array type).此外,您还可以在错误中看到,
CustomerTransfert[]
类型(这是一个数组类型)上不存在num
。
You have to use ngFor
too iterate over customerTransferts
array and then you can access the num
field.您还必须使用
ngFor
遍历customerTransferts
数组,然后才能访问num
字段。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.