title: Angular 5 NgFor only supports binding to Iterables such as Arrays
body: <p>I am getting <code>Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.</code> error while I am trying to print all of my database records.</p>
  
  <p>I have used this <a href="https://github.com/angular/angularfire2/blob/master/docs/rtdb/objects.md" rel="nofollow noreferrer">source</a> to get the data from firebase. Somehow it does not work. Is my json file structure wrong or the type of the array should be different?
  What I am doing wrong?</p>
  
  <p><strong>firebase (json)</strong></p>
  
  <pre><code>{
    "clients" : {
      "-L4jvQwBFM0W8A928waj" : {
        "id" : "124",
        "lastName" : "sda421",
        "name" : "412"
      },
      "-L4jz52GfcU4ZsJx_LX0" : {
        "id" : "214",
        "lastName" : "sda ",
        "name" : "sad "
      },
      "-L4k-5xNmN4dalqFj2dB" : {
        "id" : "12345678",
        "lastName" : "Pafasfbin",
        "name" : "fasf"
      },
      "-L4k-Dw5TA6FnHpWDiIq" : {
        "id" : "52353235",
        "lastName" : "qweqw",
        "name" : "qwrqwe "
      }
    }
  }
  </code></pre>
  
  <p><strong>clients.component.ts</strong></p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  
  import { AngularFireModule } from 'angularfire2';
  import { AngularFireDatabase } from 'angularfire2/database' ;
  import { Observable } from 'rxjs';
  
  
  @Component({
    selector: 'app-clients',
    templateUrl: './clients.component.html',
    styleUrls: ['./clients.component.css']
  })
  export class ClientsComponent implements OnInit {
    // clients: any[];
    clients: Observable&lt;any[]&gt;;
  
    name: string;
    lastName: string;
    id: number;
  
    constructor(public db: AngularFireDatabase) { }
  
    ngOnInit() {
      this.getData();
    }
  
    getData(){
      this.clients = this.db.list('/clients').valueChanges();
      console.log(this.clients);
    }
  }
  </code></pre>
  
  <p><strong>clients.component.html</strong></p>
  
  <pre><code>&lt;ul&gt;
    &lt;li *ngFor="let i of clients"&gt;
      &lt;label&gt;name: &lt;/label&gt; {{ i.name }}
      &lt;label&gt;lastName: &lt;/label&gt; {{ i.lastName }}
      &lt;label&gt;ID: &lt;/label&gt; {{ i.id }}
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>