Как мне преобразовать полученный json в массив, который я бы мог прогнать через ngFor?

Question

[Saharman]

Получаю вот такой Json от сервера:

{
    "code": 0,
    "error": null,
    "data": [
        {
            "id": 2,
            "name": "A"
            "Numbers": []
        },
        {
            "id": 3,
            "name": "B,
            "description": "V",
            "Numbers": []
        }
    ]
}

Пробовал преобразовывать его с помощью:
result.json().data
но выдает ошибку, что json не функция. Так же использовал JSON.parse, но ничего не дало.

Comments

[Антон Швец]

покажите код, как получаете и записываете данные

Answer 1

[Demian Smith]

Не нужно result.json()

Данные уже там.

result.data достаточно.

(при условии что вы используете Angular > 4.3)

Comments

[Saharman]

Странно, но если вывести в консоль, то когда мы обрабатываем полученные данные после запроса, то это массив, а когда возвращаем в компонент, то это undefined. Не могли бы вы подсказать, как получить такой json, вернуть в компонент и использовать в ngFor (нужно вывести result.data.name).

[Demian Smith]

Saharman,

Вот так

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { map } from 'rxjs/operators';

@Component({
  selector: 'example',
  template: `
    <div *ngFor="let dataElement of data$ | async">
      {{ dataElement.name }}
    </div>
  `,
})

export class ExampleComponent implements OnInit {
  public data$;

  constructor(private http: HttpClient) {
  }

  ngOnInit(): void {
    this.data$ = this.http.get('http://url.com').pipe(
      map(response => response.data)
    );
  }
}

Для того чтоб не сойти с ума с ангуляром, советую разобраться с тем что такое Observable.

Вот видео, немного проясняющее суть вопроса, https://www.youtube.com/watch?v=3LKMwkuK0ZE