Angular中对象数据结构中的对象

Question

我从API接收这些结果：

{
"97": {
"Title": "This is a title",
},
"98": {
"Title": "This is another title",
}
}

我正在使用这个界面：

export interface Product {
Title: string;
}
export interface SKU {
[key: string]: Product
}

我的界面看起来还好吗？我如何在 Angular 中使用这种类型的 stracture 关于 *ngFor？

Answer 1

我认为看起来还可以， 并且为了将其与ng一起使用，我认为您需要使用map函数将对象转换为数组。

var arr = Object.keys(objectName).map((index)=>{
let item = objectName[index];
return item ;
});

然后在 *ngFor 中使用 arr

Answer 2

你想要实现的是一个数组

[
"97": {
"Title": "This is a title",
},
"98": {
"Title": "This is another title",
}
]

将您的 API 响应解析为SKU[]。要实现此结构，您可以更正服务器代码(正确的方法(或执行一些花哨的对象到数组的转换(不要这样做(。

在组件中将此结果解析为SKU[]后，您可以使用*ngFor在视图中迭代。