title: Uncaught TypeError: Cannot read property 'id' of undefined in Http services in console in angular?
body: <p>I am using http services in angular
   I am  having a constructor as :</p>
  
  <pre><code>    import { HttpClientModule,HttpClient } from '@angular/common/http';
  import { Component, OnInit } from '@angular/core';
  
  @Component({
    selector: 'app-posts',
    templateUrl: './posts.component.html',
    styleUrls: ['./posts.component.css']
  })
  export class PostsComponent implements OnInit {
  
    posts:any[];
  
    constructor( private http:HttpClient) {
     http.get('http://jsonplaceholder.typicode.com/posts').
      subscribe(response=&gt;{
        this.posts=&lt;any&gt;response;
  
      })
     }
  
    ngOnInit(): void {
    }
  
  
  
  }
  </code></pre>
  
  <p>HTml part:</p>
  
  <pre><code>&lt;ul class="list-group"&gt;
      &lt;li *ngFor="let post of posts" class="list-group-item"&gt;{{post.title}}&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>BUt in console i am gettin error as 
  "Uncaught TypeError: Cannot read property 'id' of undefined".TRied with several ways but still getting this error.</p>
  
  <p>app.module.ts</p>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  
  import { interval } from 'rxjs';
  import {NgForm, FormsModule, ReactiveFormsModule} from '@angular/forms';
  
  import { AppRoutingModule } from './app-routing.module';
  import { AppComponent } from './app.component';
  import { Block1Component } from './block1/block1.component';
  import { Block2Component } from './block2/block2.component';
  import { HomeComponent } from './home/home.component';
  
  import { PostsComponent } from './posts/posts.component';
  import { HttpClientModule,HttpClient } from '@angular/common/http';
  
  
  @NgModule({
    declarations: [
      AppComponent,
      Block1Component,
      Block2Component,
      HomeComponent,
  
      PostsComponent
    ],
    imports: [
      BrowserModule,
      HttpClient,
      AppRoutingModule,
      HttpClientModule,
      FormsModule,
      ReactiveFormsModule,
  
  
    ],
    providers: [],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>App module is added.The issue is i am getting the error again as </p>
  
  <pre><code>core.js:35929 Uncaught TypeError: Cannot read property 'id' of undefined
      at registerNgModuleType (core.js:35929)
      at core.js:35947
      at Array.forEach (&lt;anonymous&gt;)
      at registerNgModuleType (core.js:35943)
      at new NgModuleFactory$1 (core.js:36105)
      at compileNgModuleFactory__POST_R3__ (core.js:41895)
      at PlatformRef.bootstrapModule (core.js:42260)
      at Module../src/main.ts (main.ts:12)
      at __webpack_require__ (bootstrap:79)
      at Object.0 (main.ts:13)
  </code></pre>