数据集未显示在 html 中

Question

我有以下数据集，我正在尝试在我的HTML中显示。

[{
"InvestmentStrategy": {
"name": [
"Lifestage",
"Shari'ah",
"Comprehensive"
]
},
"RiskRating": {
"name": [
"Conservative",
"Moderate",
"Aggresive"
]
},
"Management": {
"name": [
"Active",
"Passive"
]
}
}]
<div *ngFor="let i of portfolioSelection.InvestmentStrategy">
{{ i.name }}
</div>

投资组合选择是如上所示的整个数据集。 我只想显示投资策略名称，但目前收到以下错误类型错误：无法读取未定义的属性"投资策略">

Answer 1

您正在尝试访问数组内对象的属性，因此您需要执行以下操作：

portfolioSelection = [{
"InvestmentStrategy": {
"name": [
"Lifestage",
"Shari'ah",
"Comprehensive"
]
},
"RiskRating": {
"name": [
"Conservative",
"Moderate",
"Aggresive"
]
},
"Management": {
"name": [
"Active",
"Passive"
]
}
}]
<div *ngFor="let item of portfolioSelection">
<div *ngFor="let x of item?.InvestmentStrategy?.name">
{{ x }}
</div>
</div>