我想在 Angular 2 中使用 *ngFor 迭代 [object object]。
问题是该对象不是对象的数组,而是包含更多对象的对象的对象。
{
"data": {
"id": 834,
"first_name": "GS",
"last_name": "Shahid",
"phone": "03215110224",
"role": null,
"email": "[email protected] /cdn-cgi/l/email-protection",
"picture": **{ <-- I want to get thumb: url but not able to fetch that**
"url": null,
"thumb": {
"url": null
}
},
"address": "Nishtar Colony",
"city_id": 2,
"provider": "email",
"uid": "[email protected] /cdn-cgi/l/email-protection"
}
}
我知道我们可以使用管道来迭代对象,但是我们如何进一步从一个对象迭代到另一个对象意味着数据->图片->thum:url.
角 6.0.0
https://github.com/angular/angular/blob/master/CHANGELOG.md#610-2018-07-25 https://github.com/angular/angular/blob/master/CHANGELOG.md#610-2018-07-25
介绍了一个KeyValuePipe
也可以看看https://angular.io/api/common/KeyValuePipe https://angular.io/api/common/KeyValuePipe
@Component({
selector: 'keyvalue-pipe',
template: `<span>
<p>Object</p>
<div *ngFor="let item of object | keyvalue">
{{item.key}}:{{item.value}}
</div>
<p>Map</p>
<div *ngFor="let item of map | keyvalue">
{{item.key}}:{{item.value}}
</div>
</span>`
})
export class KeyValuePipeComponent {
object: {[key: number]: string} = {2: 'foo', 1: 'bar'};
map = new Map([[2, 'foo'], [1, 'bar']]);
}
original
您可以使用管道
@Pipe({ name: 'keys', pure: false })
export class KeysPipe implements PipeTransform {
transform(value: any, args: any[] = null): any {
return Object.keys(value)//.map(key => value[key]);
}
}
<div *ngFor="let key of objs | keys">
也可以看看如何使用 *ngFor 迭代对象键? https://stackoverflow.com/questions/37046138/how-to-use-ngfor-with-object/37046743#37046743
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)