ERROR Error: Error trying to diff '[object Object]'. Only arrays and iterables are allowed at DefaultIterableDiffer.diff

*Hey Guys, Hope you will be fine. Actually, I am facing an error with Ionic and woocommerce. I want to display my woocommerce course into my ionic app. I have a data in variable. But, When I use ngFor, I get an error given below:

here is my code .html:

And .ts file:

Please help

<ion-list *ngFor = "let righ of right.title">

Try this.

Hey, Thank You. The error is gone but the title is not displaying. See my code below

And the output is that:

Please help.

Can you please show the result from server!


Please display title more clearly. I mean , please expand the ‘title’ data

OK, Now check

Try this code

<ion-list *ngFor = "let righ of right.title">
 {{ righ['rendered'] }}
1 Like

Unfortunately, it’s not working. see my output:

and the code:

It looks like you are trying to loop over right as if it were an array, but instead it is an object.

If the result from getPosts() will always be a single object you should get rid of the *ngFor= logic and just reference the object directly in the template <h1>{{ this.right.title.rendered }}</h1>.

If the response from getPosts() can be an array or a single object, you should be able to add a check in your getPosts method…something like this should work this.right = data.length ? data : [data].

But IF you have access to the api code that is returning the response for the getPosts method, you should always return an array whether the result set contains 1 record or 100 records