用ngFor迭代一个Json对象

我从Web服务器获取以下JSONstring。

[ {"name":"Joe Lincoln","age":"42","grade":"9","active":"1"}, {"name":"Jack Smith","age":"38","grade":"8","active":"1"}, {"name":"Peter Smith","age":"42","grade":"9","active":"0"}, {"name":"Eva Lorens","age":"42","grade":"8","active":"1"}, ] 

我想在HTML中公开JSON，我尝试了以下但字段不被填充，我也得到没有例外，所以我很难找出为什么它不工作。

TS

  this.servletService.webserviceCall('MemberUnit', 'getMembers', params).then((obs)=>{ obs.subscribe( (data) => { this.members = JSON.parse(data); }); }) 

HTML

  <ion-item *ngFor="let member of members"> <ion-avatar item-left> <svg width="75px" height="75px" > <text x="50%" y="50%" text-anchor="middle" stroke="#2980b9" stroke-width="2px" dy=".1em">{{member.grade }}</text> </svg> </ion-avatar> <h2>{{member.name}}</h2> <h3>{{member.age}}</h3> </ion-item> 

Answer 1

您可以使用Object.keys从对象中获取密钥（需要IE AFAIK中的填充）

 import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'keys' }) export class KeysPipe implements PipeTransform { transform(value): any { if(!value) return null; return Object.keys(value); } } 

 <div *ngFor="let key of member | keys">{{member[key]}}</div>