可观察类型错误：无法读取未定义的属性

Question

可观察类型错误：无法读取未定义的属性

在我的Angular 2应用程序中，我收到一个错误：

无法读取undefined的属性'title'。

这是一个非常简单的组件，只是试图在这里工作。它击中我的API控制器（奇怪地多次），它似乎在返回一个对象后点击回调。我的console.log输出了我期望的对象。这是完整的错误：

TypeError: Cannot read property 'title' of undefined
    at AbstractChangeDetector.ChangeDetector_About_0.detectChangesInRecordsInternal (eval at <anonymous> (http://localhost:55707/lib/angular2/bundles/angular2.dev.js:10897:14), <anonymous>: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)

该服务（about.service.ts）：

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 => {
            console.log(res.json()); // I get the error on the line above but this code is still hit.
            return <AboutModel>res.json();
        });
    }}

Answer 1

它看起来像你about.title在视图中引用，about.html但about只有在http请求完成后才会实例化变量。为避免此错误，您可以about.html使用<div *ngIf="about"> ... </div>