Question

我正在尝试将json响应转换为角度为2的数组。以下是我使用的代码，

.ts文件

  response;
  resp;
  constructor(private http:Http) {
   }
   get()
   {
         this.http.get("http://localhost:3000/items")
         .map(res=>res.json())
         .subscribe(data=>this.response = JSON.stringify(data))

           this.resp = JSON.parse(this.response);
      }

component.html

 {{response}}
 <ul>
    <li *ngFor="let k of resp">{{k}}</li>
  </ul>

</div>

虽然{{response}}只会导致显示整个json内容，但我无法迭代在resp中检索到的响应，尽管使用了JSON.parse（）。

如何将响应转换为数组并访问各个属性？

Answer 1

根据您的代码，我看不到您正在设置resp变量。

您将值存储在响应变量中并迭代在resp变量上。

应该是（让k的响应）而不是（让k的resp）

Answer 2

您只能使用ngFor迭代数组。如果你的响应是一个json对象，那么你不能使用ngFor直接迭代它。为此，您需要使用管道通过ngFor迭代json对象。

您可以创建一个管道。

@Pipe({ name: 'keys',  pure: false })
export class KeysPipe implements PipeTransform {
    transform(value: any, args: any[] = null): any {
        return Object.keys(value)
    }
}

在模块中导入此管道并将其传递给declrations。然后你可以在你的html中使用它：

 {{response}}
 <ul>
    <li *ngFor="let k of resp | keys">{{k}}</li>
  </ul>

</div>

将json响应转换为角度为2

2 个答案: