代码之家  ›  专栏  ›  技术社区  ›  RuD3B0y

如何在表中显示{object object}?

  •  1
  • RuD3B0y  · 技术社区  · 7 年前

    this data

    我用的是角度4。

    3 回复  |  直到 7 年前
        1
  •  2
  •   Hardik Patel    7 年前

    您需要创建一个管道,然后可以遍历对象。

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

    这个plnkr可能会帮助你。

    plnkr

        2
  •  1
  •   RuD3B0y    7 年前

    function generateArray(obj) {
      return Object.keys(obj).map((key) =>  obj[key] );
    }
    

    <tr *ngFor="let post of posts">
                <td>{{post.last}}</td>
                <td>{{post.buy}}</td>
                <td>{{post.sell}}</td>  
              </tr>
    

    这将把json迭代到一个表中。

        3
  •  0
  •   JeanPaul A.    7 年前

    ngFor适用于iterables,因此在您的情况下,需要首先将json数据转换为数组。

    let blockChainData:any = { ... } //data.retrieved.from.server;
    let blockChainDataArray:Array<any> = [];
    
    let dataKeys:Array<string> = Object.keys(blockChainData);
    dataKeys.forEach((key:string) => {
       let entry:any = blockChainData[key]; // Retrieve the object associated with the currency
       entry.originalCurrency = key; // Preserve the original currency
       blockChainDataArray.push(entry);
    });
    

    在html代码中,迭代数组

    <td *ngFor="let entry of blockChainDataArray">{{ entry.originalCurrency }} {{ entry.buy }} {{ entry.sell }} {{ entry.last }} </td>