angular - Response.json()使用接口(interface)绑定(bind)到单个对象-RxJs/Observable失败

当restful api返回一个json数组时，这个场景工作得很好，但是我调用的web方法返回一个json对象，因此代码已经被转换为从<IRegistration[]> to <IRegistration>映射一个对象，一直映射到堆栈上。
此操作失败，chrome控制台返回一个错误，显示应用程序在html中找不到任何映射字段
HTML

{{myobject.productId}}
{{myobject.productName}}

JSON

{
  "productId": 1,
  "productName": "My Field Value"
}

接口

export interface IRegistration {
    productId: number;
    productName: string;
}

可观察的

getRegistration(): Observable<IRegistration> {
    return this._http.get(this._svcURL)
        .map((response: Response) => <IRegistration>response.json())
        .do(data => console.log('ALL: ' + JSON.stringify(data)))
        .catch(this.handleError);
}

客户端组件

myobject: IRegistration;

ngOnInit(): void {
    this._registrationService.getRegistration().subscribe(
        reg => this.myobject= reg,
        error => this.errorMessage = <any>error
    );
}

误差

 EXCEPTION: TypeError: Cannot read property 'productId' of undefined in [
{{myobject.productId}}
{{myobject.productName}}

 in SearchComponent@0:0]

我所做的调试指向observate中的response.json（）未能正确映射到iregistration-我似乎找不到正确的语法？

最佳答案

代码看起来很好，我认为问题是在使用之前没有初始化myobject: IRegistration;。
doc for lifecycle hook ngOnInit()表示：
在angular首先显示数据绑定属性并设置指令/组件的输入属性之后初始化指令/组件。
数据在http调用返回任何结果之前显示，因此当angular试图呈现它时，myobject是未定义的。
您可以使用?忽略未定义的属性，例如{{ myobject?.productId }}或先初始化属性myobject: IRegistration = <IRegistration>{};。