使用 ngFor 从对象获取子对象
Get Child Object from Object using ngFor
使用 ngFor 从对象获取子对象,
我想显示属性对象的子对象。
像 :
first_name, last_name, address , inside address 我们有 street_1, street_2 等,使用 ngFor
HTML:
<div *ngIf="!!JsonSchema">
<div *ngFor="let field of JsonSchema.properties"> {{field | json}}</div>
</div>
TS:
JsonSchema = {
"type": "object",
"properties": {
"first_name": {
"type": "string"
},
"last_name": {
"type": "string"
},
"address": {
"type": "object",
"properties": {
"street_1": {
"type": "string"
},
"street_2": {
"type": "string"
},
"city": {
"type": "string"
},
"state": {
"type": "string",
},
"zip_code": {
"type": "string"
}
}
},
}
你可以试试:
<div *ngFor="let item of JsonSchema.properties | keyvalue">
<li>{{item.key}}</li>
<ul *ngFor="let element of item.value | keyvalue">
<li>{{element.key}}</li>
<ul *ngIf="element.key === 'type'">
<li>{{element.value}}</li>
</ul>
<ul *ngIf="element.key === 'properties'">
<ul *ngFor="let elem of element.value | keyvalue">
<li>{{elem.key}}-->{{elem.value.type}}</li>
</ul>
</ul>
</ul>
</div>
使用 ngFor 从对象获取子对象,
我想显示属性对象的子对象。 像 : first_name, last_name, address , inside address 我们有 street_1, street_2 等,使用 ngFor
HTML:
<div *ngIf="!!JsonSchema">
<div *ngFor="let field of JsonSchema.properties"> {{field | json}}</div>
</div>
TS:
JsonSchema = {
"type": "object",
"properties": {
"first_name": {
"type": "string"
},
"last_name": {
"type": "string"
},
"address": {
"type": "object",
"properties": {
"street_1": {
"type": "string"
},
"street_2": {
"type": "string"
},
"city": {
"type": "string"
},
"state": {
"type": "string",
},
"zip_code": {
"type": "string"
}
}
},
}
你可以试试:
<div *ngFor="let item of JsonSchema.properties | keyvalue">
<li>{{item.key}}</li>
<ul *ngFor="let element of item.value | keyvalue">
<li>{{element.key}}</li>
<ul *ngIf="element.key === 'type'">
<li>{{element.value}}</li>
</ul>
<ul *ngIf="element.key === 'properties'">
<ul *ngFor="let elem of element.value | keyvalue">
<li>{{elem.key}}-->{{elem.value.type}}</li>
</ul>
</ul>
</ul>
</div>