Angular从API获取成功，但值未定义

Question

使用Angular，我试图从API获取数据。GET请求似乎是成功的，因为当我在控制台视图中显示GET结果时，我可以看到我得到了一个大小正确且值正确的数组。问题是，当我试图从数组元素中读取单个数据时，它是未定义的。

export class Achat {
constructor(
public IDAchat_PK: number,
public Date: Date,
public Fournisseur: string,
public FraisLivraison: string,
public status: number
) {}
}

export class DbService {
/* Back end URL */
public Back_End_Url = "https://localhost:7198/pokegong/";
constructor(private httpClient: HttpClient) { }
public GetAchats(): Observable<Achat> {
return this.httpClient.get<Achat>(this.Back_End_Url + "Achat");
}
}

export class StockComponent implements OnInit {

achats: Achat[] = [];
constructor(private dbService: DbService) { 
}
ngOnInit(): void {
console.log("app-stock is initializing");
this.GetAchats();
}
GetAchats() {
/* Get stock items from Back End and fill _stock_items*/
return this.dbService.GetAchats().subscribe((data: {}) => {
this.achats = data;
console.log(this.achats[3])
console.log(this.achats[3].Fournisseur)
});
} 
}

在执行console.log(this.achats[3])时，我可以在控制台中看到文本{idAchat_PK: 4, date: '2022-10-05T00:00:00'， fournisseur: 'VISTAPRINT'， fraisLivraison: 6.19, status: 2}

然而，在执行console.log(this.achats[3]. fournisseur)时，我得到了'undefined'的值。

我所有的变通方法都不成功。我真的不明白我如何能够读取完整的JSON记录，但不是这个记录中的单个元素。

非常感谢你的帮助。

Answer 1

你的代码有一个错误。你指的是Fournisseur而不是fournisseur…

JS是一种区分大小写的语言。

Answer 2

控制台日志显示小写fournisseur关键。在你的类中，你使用一个大写的变量"F"F (ournisseur)。因此，该值不能进行右转换。

我想console.log(this.achats[3].fournisseur)也可以。

您也可以映射结果，如const convertedResult = this.achats.map((data) => {return new Achat(.....);})

问候,弗洛