title: Angular9: Getting Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays
body: <p>I have created a simple app to call backend services using HttpClientModule,, but  data is not showing into the log, I did the following steps and I am using angular-9</p>
  
  <p>could you please check the code.</p>
  
  <p>Thanks in Advance.</p>
  
  <ol>
  <li>app.module file</li>
  </ol>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { HttpClientModule} from '@angular/common/http';
  import {RestAPIServices} from './services/rest-api.service';
  import { AppComponent } from './app.component';
  
  @NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule,
      HttpClientModule
    ],
    providers: [RestAPIServices],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <ol start="2">
  <li>model.ts</li>
  </ol>
  
  <pre><code>export class Employee{
      id:number;
      name:string;
      gender:string;
      email? :string; // ? means optional property
      mobile:string;
      department:string;
      isActive:boolean;
      photo? :string;
  }
  </code></pre>
  
  <ol start="3">
  <li>service.ts</li>
  </ol>
  
  <pre><code>import {Injectable } from '@angular/core';
  import { Observable } from 'rxjs';
  import {HttpClient} from '@angular/common/http';
  import { Employee } from '../models/employee.model';
  
  @Injectable()
  export class RestAPIServices{
  
      constructor(private httpClient:HttpClient){}
  
     getEmployee():Observable&lt;Employee[]&gt;{
      //this.httpClient.get&lt;Employee[]&gt;("http://127.0.0.1/angularCRUDservices/user/getEmployees").subscribe(res=&gt;  console.log(res));
      return this.httpClient.get&lt;Employee[]&gt;("http://127.0.0.1/angularCRUDservices/user/getEmployees");
     }
  
  }
  </code></pre>
  
  <ol start="4">
  <li>app.component.ts</li>
  </ol>
  
  <pre><code>import { Component } from '@angular/core';
  import {RestAPIServices} from './services/rest-api.service';
  import {Employee} from './models/employee.model';
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  export class AppComponent {
  
    listEmployee : Employee[];
    title = 'simple-rest-app';
  
    constructor(private _employeeService:RestAPIServices){}
    ngOnInit(){
  
      this._employeeService.getEmployee().subscribe(
        data=&gt;{
          console.log(data)
          this.listEmployee = data;
        }
      )
  
      console.log(this.listEmployee);
    }
  
  }
  </code></pre>
  
  <p>servire is tested from postman and it's working fine</p>
  
  <pre><code>{"response":[{"id":"1","name":"Anand","gender":"Male","email":"a@gmail.com","mobile":"111111111","department":"2","isActive":"1","photo":"assets\/images\/emp1.jpg"},{"id":"2","name":"Kiran","gender":"Female","email":"k@gmail.com","mobile":"2222222222","department":"2","isActive":"1","photo":"assets\/images\/emp1.jpg"},{"id":"3","name":"Ravi","gender":"Male","email":"r@gmail.com","mobile":"3333333333","department":"2","isActive":"1","photo":"assets\/images\/emp2.jpg"},{"id":"4","name":"Kumar","gender":"Male","email":"k@gmail.com","mobile":"4444444444","department":"3","isActive":"1","photo":"assets\/images\/emp4.jpg"}]}
  </code></pre>