Displaying an array in html

I get this error when i try to display in my html file.
Error: Error trying to diff ‘[object Object]’. Only arrays and iterables are allowed

service.ts

private _addProduct = “http://localhost:4000/viewMenu”;
getItems(){
return this.httpClient.get(this._addProduct);
}

page.ts

menuList = ;
ngOnInit() {
this.cartService.getItems().subscribe(data => {
console.log(data);
this.menuList = data;
console.log(this.menuList);
});

page.html

<ion-card *ngFor=“let p of menuList”>
{{p.item_name}}

{{p.item_price | currency:‘R’}}

In your first Line in page.ts:
menuList = ...;

What exactly is the value you assign there? I only see a random Square.

ow sorry its an array.

menuList: Array;

So it is menuList: Array; ? Without any = ?

console.log(this.menuList);

And what is printed out here?

the console.log(this.menuList) displays the data in my database, I just wanted to see if the data is stored

2020-03-31

as you can see the result is not an array. it has an Value that is an array, so change to:
this.menuList = data.data

1 Like

Thank you. It worked