Как отобразить {объект объекта} в таблице?

На самом деле я хочу отобразить эти данные в таблице. Здесь данные были {объект объекта}. Я хочу отобразить все значения "последний", "купить" и "продать" из всех валют. Я могу делать жесткий код, но я хочу уменьшить количество строк кода, используя ng-repeat или ngFor. Как написать условия для этого?

Я использую Angular 4.

Источник

3 ответа

Решение

Спасибо за ответы, ребята, ваши способы работали нормально. Но я нашел более простой способ сделать это:

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

это преобразует объект JSON в массив и

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

это будет повторять JSON в таблицу.

PS: я сохранил JSON в "posts" из "posts" из "posts".

Источник

Вам нужно создать канал, а затем вы можете перебрать объект.

@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

Источник

ngFor работает с итерациями, поэтому в вашем случае вам нужно сначала преобразовать данные 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>
Источник
Другие вопросы по тегам