Как я могу отобразить последнее свойство в объекте JSON первым в пользовательском интерфейсе

Question

У меня есть JSON следующего формата:

[
{Details: [{name: "WII", type:"Video Games", id:"lint"}]
]

, однако на пользовательском интерфейсе в таблице я хочу сначала отобразить идентификатор в первом столбце, а затем остальные.

Answer 1

Вы можете использовать Трубу, чтобы получить ключи и повернуть их вспять.

import { PipeTransform, Pipe } from '@angular/core';

@Pipe({name: 'keys'})
export class KeysPipe implements PipeTransform {
  transform(value, args:string[]) : any {
    let keys = [];
    for (let key in value) {
      keys.push(key);
    }
    return keys.reverse();
  }
}

STACKBLITZ DEMO

Answer 2

Давайте предположим, что это ваша структура данных JS:

let list = [
  { Details: [{ name: "WII", type: "Video Games", id: "lint" }] }
];

Тогда в вашем шаблоне компонента Angular:

<table>
  <tr *ngFor="let item of list" >
    <td>{{item.Details[0].id}}</td>
    <td>{{item.Details[0].name}}</td>
    <td>{{item.Details[0].type}}</td>
  </tr>
</table>

Конечно, это не идеально, но чтобы дать вам лучшееответ / решение, вы должны предоставить больше информации.