在 Ionic 2 中插值后，我无法在页面上获取 JSON 数据

Question

我是Ionic 2的新手，我发现自己遇到了一个问题。我看不到页面上的数据打印，每次都会出现错误，但是我能够看到API调用在控制台日志中是成功的。我的代码看起来像这样

moviedetails.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import {MBService} from '../../app/services/moviebuffs.service';

@Component({
selector: 'page-moviedetails',
templateUrl: 'moviedetails.html'
})
export class MoviedetailsPage {
id: any;
md: any;
constructor(public navCtrl: NavController, public navParams: NavParams, private moviebuffsService: MBService) {
    this.navCtrl = navCtrl;
    this.id = navParams.get('param1');
    this.getMovieDetails(this.id);
   }
  getMovieDetails(mid){
this.moviebuffsService.getMovieDetails(mid).subscribe(response => {
     console.log(response);
        this.md = response;
});
}
}

标题的响应出现在控制台中，没有任何问题，但是当我尝试通过HTML文件调用它时出现错误。

Runtime Error
Error in ./MoviedetailsPage class MoviedetailsPage - caused by: Cannot read property 'title' of undefined 

在我的html中，我称该对象为 {{md.title}} 我在做什么错？是因为我声明了构造函数内部的功能？

Answer 1

您的md字段在您的代码中以异步初始化。因此，如果模板在响应到达之前呈现：undefined。 title会丢下错误。

初始化对象，

md: any = {};

或使用安全 - 游动操作员（?），

 {{md?.title}}

或使用*ngIf检查您的对象是否有效，

<div *ngIf="md">
    {{md.title}}
</div>