title: Observable type error: cannot read property of undefined
body: <p>In my Angular 2 application, I get an error: </p>
  
  <blockquote>
    <p>Cannot read property 'title' of undefined.</p>
  </blockquote>
  
  <p>This is a very simple component, just trying to get a bare minimum to work here.  It hits my API controller (curiously multiple times), and it appears to hit the  callback after an object is returned.  My console.log outputs the object I would expect.  Here is the full error:</p>
  
  <pre><code>TypeError: Cannot read property 'title' of undefined
      at AbstractChangeDetector.ChangeDetector_About_0.detectChangesInRecordsInternal (eval at &lt;anonymous&gt; (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:10897:14), &lt;anonymous&gt;:31:26)
      at AbstractChangeDetector.detectChangesInRecords (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8824:14)
      at AbstractChangeDetector.runDetectChanges (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8807:12)
      at AbstractChangeDetector._detectChangesInViewChildren (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8877:14)
      at AbstractChangeDetector.runDetectChanges (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8811:12)
      at AbstractChangeDetector._detectChangesContentChildren (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8871:14)
      at AbstractChangeDetector.runDetectChanges (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8808:12)
      at AbstractChangeDetector._detectChangesInViewChildren (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8877:14)
      at AbstractChangeDetector.runDetectChanges (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8811:12)
      at AbstractChangeDetector.detectChanges (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:8796:12)
  </code></pre>
  
  <p>The service (about.service.ts):</p>
  
  <pre><code>import {Http} from 'angular2/http';
  import {Injectable} from 'angular2/core';
  import {AboutModel} from './about.model';
  import 'rxjs/add/operator/map';
  
  @Injectable()
  export class AboutService {
      constructor(private _http: Http) { }
  
      get() {
          return this._http.get('/api/about').map(res =&gt; {
              console.log(res.json()); // I get the error on the line above but this code is still hit.
              return &lt;AboutModel&gt;res.json();
          });
      }
  }
  </code></pre>
  
  <p>The Component (about.component.ts):</p>
  
  <pre><code>import {Component, View, OnInit} from 'angular2/core';
  import {AboutModel} from './about.model';
  import {AboutService} from './about.service';
  import {HTTP_PROVIDERS} from 'angular2/http';
  
  @Component({
      selector: 'about',
      providers: [HTTP_PROVIDERS, AboutService],
      templateUrl: 'app/about/about.html'
  })
  
  export class About implements IAboutViewModel, OnInit {
      public about: AboutModel;
  
      constructor(private _aboutService: AboutService) {}
  
      ngOnInit() {    
          this._aboutService.get().subscribe((data: AboutModel) =&gt; {
              this.about = data;
          });
      }
  }
  
  export interface IAboutViewModel {
      about: AboutModel;
  }
  </code></pre>
  
  <p>index.html</p>
  
  <pre><code>&lt;script src="~/lib/systemjs/dist/system.src.js"&gt;&lt;/script&gt;
  &lt;script src="~/lib/angular2/bundles/router.js"&gt;&lt;/script&gt;
  &lt;script src="~/lib/angular2/bundles/http.js"&gt;&lt;/script&gt;
  &lt;script src="~/lib/angular2/bundles/angular2-polyfills.js"&gt;&lt;/script&gt;
  &lt;script src="~/lib/angular2/bundles/angular2.dev.js"&gt;&lt;/script&gt;
  &lt;script src="~/lib/es6-shim/es6-shim.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      System.config({
          packages: {
              app: {
                  format: 'register',
                  defaultExtension: 'js'
              },
              rxjs: {
                  defaultExtension: 'js'
              }
          },
          map: {
              rxjs: "lib/rxjs"
          }
      });
      System.import('app/boot')
              .then(null, console.error.bind(console));
  &lt;/script&gt;
  </code></pre>