Please explain Cannot find a differ supporting object

Ionic Framework ionic-v3
1

Hello,

can anyone here please explain to me what does Cannot find a differ supporting object error means?
This happen when I try to use *ngFor iteration. I am kind of lost on how to use ngFor here to iterate my JSON array.

Thanks

2

I had that error recently and solved it. Post your code - its impossible to help without seeing what you are doing.

3

This might be more of an angular issue than ionic, also see this issue https://github.com/angular/angular/issues/6392

4

@richardshergold basically I am trying to show my fetched JSON data inside an ion-row and column.

here’s snippet of my code

this.dataSvc.getData(this.x,this.y).subscribe( data => { if (data.json().result.rs == 1) { this.testArr = data.json().result.params.arr; this.testX = data.json().result.params.x; this.testY = data.json().result.params.y; } }, error => {}, () => console.log("Subscribe done") );

My HTML Part
> <ion-row *ngFor="#data of testArr"> > <ion-col><div>{{data.date}}</div></ion-col> > <ion-col><div>{{data.textinfo}}</div></ion-col> > <ion-col><div>{{data.amount}}</div></ion-col> > </ion-row>

dataSvc is service class that just return http.get()

portion of returned JSON looks like this

{"jsonsw":"1.0","result":{"rs":1,"rspcode":"01","message":"Call Success","params":{"x":"First Params callback","y":"Second Params callback","arr":{"0":{"date":"26\/01\/2016","textinfo":"1st Trx","enum":"239956","amount":"2500000.00"},"1":{"date":"01\/02\/2016","textinfo":"2nd Trx","enum":"739631","amount":"61700.00"},"2":{"date":"01\/02\/2016","textinfo":"3rd Trx","enum":"973771","amount":"12340.00"},"3":{"date":"12\/02\/2016","textinfo":"4th Trx","enum":"339993","amount":"50000.00"},"4":{"date":"12\/02\/2016","textinfo":"5th Trx","enum":"259971","amount":"350000.00"},"DataCount":5}},"printdata":""},"id":0}

@sphaso Thanks for the link! I have take a look and try the dirty hack but still got error. when using example hack function (which simply convert to Array.from(val)) I got error Cannot convert undefined or null to object

What is the meaning of this error really?

======

Is it because page already loaded before subscribe finished? I put ts code above inside constructor function.

5

@richardshergold what cause your error and how you solve it? perhaps I can apply your solution for my case.

If I remove *ngFor and just put testArr on data binding it will show [object Object] only

6

I can’t remember! I definitely had that error though and I got round it. Does it work if you hardcode that JSON data into your object i.e without the asyc loading?

7

yeah, I am still fiddling with it.

I try to remove http.get subscribe and hardcode it

this.testArr = {"0":{"date":"26\/01\/2016","textinfo":"1st Trx","enum":"239956","amount":"2500000.00"},"1":{"date":"01\/02\/2016","textinfo":"2nd Trx","enum":"739631","amount":"61700.00"}};

and

this.testArr = [{"0":{"date":"26\/01\/2016","textinfo":"1st Trx","enum":"239956","amount":"2500000.00"},"1":{"date":"01\/02\/2016","textinfo":"2nd Trx","enum":"739631","amount":"61700.00"}}]

first trial gave me same error and 2nd code gave no error but because of text format I can’t access it using {{data.date}} but should be {{data[0].date}} instead

this.testArr = [{"date":"26\/01\/2016","textinfo":"1st Trx","enum":"239956","amount":"2500000.00"},{"date":"01\/02\/2016","textinfo":"2nd Trx","enum":"739631","amount":"61700.00"}}]

trying to hardcode this and data shown correctly. So I guess *ngFor only accept variable in array format?

8

Yes I guess that’s it :slight_smile:

9

For me Object.keys(value).map(key => value[key]); worked:grinning::slight_smile:

10

hi developersourav, I have the same problem, and would like to apply the keys with the response object, but not succeeded, could you help me to provide some more code snippet?