Как правильно отобразить один json объект в представлении?

Question

Я могу отобразить запрашиваемый объект через {{ item | async | json }} Как получить его вывести в представление нужные мне значения?

https://stackblitz.com/edit/angular-ivy-ihtp8h?file=src/app/app.component.html

Answer 1

Чтобы отобразить данные объекта можно использовать новый компонент.

Передаем в компонент item-view наши данные с async.

<div>
  <h3>Вот json объект</h3>
  <pre>
      {{ item | async | json }}
  </pre>
</div>

<hr />

<item-view [item]="item | async"></item-view>

В самом компоненте просто отображаем данные и принимаем их через @Input()


@Component({
  selector: 'item-view',
  template: `
              <div>{{ item.id }}</div>
              <div>{{ item.name }}</div>`,
})
export class ItemViewComponent {
  @Input() item: any;
}

БЛОГ НА HUSL

Как правильно отобразить один json объект в представлении?

Ответы (1 шт):