ngFor 在对象而不是数组上？

Question

在控制台中收到此错误：

找不到不同类型的支持对象“[object Object]” '目的'。 NgFor 只支持绑定到 Arrays 等 Iterables。

services.ts

      private url = "https://api.iextrading.com/1.0/stock/market/batch?symbols=SNAP,fb,AIG%2b,GOOG,AAPL,AMZN&types=quote";

      constructor(private http: HttpClient) {}

      getCID(): Observable<any> {
        return this.http.get<any>(this.url);
      }

组件.ts

      ngOnInit() {
        this.svc.getCID().subscribe(data => {
          this.cidData = data;
          console.log(data);
        });

component.html

    <div *ngIf="cidData">
      <ul>
        <li *ngFor="let x of cidData">
          <a routerLink="/companydetails/{{x.symbol}}">{{x.symbol}}</a>

API 调用提供

    {"GOOG":{"quote":{"symbol":"GOOG","companyName":"Alphabet Inc."}}, "SNAP":{etc...}

我认为问题在于 cidData 不是数组，但我不确定如何将其作为数组返回

Answer 1

如果您使用的是 Angular 版本 6，那么您可以使用内置的管道键值来遍历对象

 <li *ngFor="let x of cidData | keyvalue">
      <a routerLink="/companydetails/{{x.value.quote.symbol}}">{{x.value.quote.symbol}}</a>

Answer 2

通过Object.values(obj)把你的对象变成一个数组，可以看here

// object with your example here
    ngOnInit() {
        this.svc.getCID().subscribe(data => {
            this.cidData = data;
            let array = 
            Object.values(this.cidData.GOOD) 
            // here you have an array    
            console.log(array);
   });