Error in NgFor Can not find a differ supporting object '[object Object]'

Question

Error in NgFor Can not find a differ supporting object '[object Object]'

Navigation

#1 by (1 votes)
#2 by (0 votes)

4

I need some help, I'm working on a project in angular on an agenda, but when I try to call the database objects I get the following error:

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

my service is like this:

getContact() {
    return this._http.get(this.url)
    .map(res => {
      this.contact = res.json();
    });
  }

and I receive it here:

export class ContactComponent implements OnInit {
    constructor(private contactService:ContactService){}
    ngOnInit(){
        this.contactService.getContact().subscribe();
    }
}

that should return me a json with the contacts in my database to then show them in a table but gives the error before said.

how can I solve it?

javascript typescript angular

asked by Jose Campos 14.07.2017 в 06:04

source

2 answers

predefined iterables: implications with the length property and the access operator [] Hide scroll bar without disabling it

score 1 · Answer 1

As you already say the failure you receive, ngFor supports only one array list. That is, you have to put your result in an array.

Solution:

// Iniciar variable de la instancia
contact: Array<Object>;

getContact() {

    this._http.get(this.url)
        .map( res => res.json() )
        .subscribe( data => {

            this.contact = [];

            data.forEach( ( x ) => {

                this.contact.push( x );
            } );

        }, err => { } );
    }

and in ngOnInit call the function:

ngOnInit(){

    this.contactService.getContact();
}

score 0 · Answer 2

0

this._http.get(this.url)
    .map( res => res.json() )
    .subscribe( data => {

        this.data = data;

        var me = this;
        me.data = Object.keys(me.data ).map(function(key) {return me.data [key];});

}

answered by 26.09.2018 в 22:01