Display json data with angular 7

Question

I want to display json data on screen with Angular 7. I have an error.

Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

In my service;

getData(): Observable <any> {
        return this.http.get(this.myUrl);
    }

In my component;

public data: []= null;

    ngOnInit() {
          this.myService.getData().subscribe((d) => this.data = d);
      }

In my html;

<tbody>
  <tr *ngFor = "let people of data">
    <td> {{ people.name}}</td>
  </tr>
</tbody>

My json;

{
    "people": [
        {
            "number": [
                0,
                0
            ],
            "name": "arya"
        },
        {
            "number": [
                1,
                1
            ],
            "name": "arya2"
        }
    ]
}

How can I display these data, which in json, on screen with html?

Answer 1

Initialize your variable data with an empty array.

public data: [] = [];

and assign d.person to data variable.

this.myService.getData().subscribe((d) => this.data = d.people);