Question

我正在创建一个模拟离子项目，我需要显示帖子细节，一切正常，除非我尝试渲染post对象属性，如

{{post.title}}

在帖子详情模板中，我收到以下错误，

Cannot read property 'title' of undefined

组件代码段是

  constructor(public navCtrl: NavController, public postdetailservice: PostDetailService) {}

  ngOnInit() {
    this.getPostDetail();
  }
  getPostDetail() {
    let id = '57f8e0797224ae55254878b6';
    this.postdetailservice.getDetail(id).subscribe(
      data => {
        this.post = data;
        console.log('Post Detail', this.post.title);
      },
      err => {
        this.errormessage = 'Post Details Not Found';
        console.log(this.errormessage, err);
      });
  }

发布api调用的服务代码，

  getDetail(postId): Observable<[any]> {
    let url = postUrl + postId + '/detail';
    return this.http.post(url,{},options)
    .map(this.getData)
    .catch(this.handleError);

  }

  private getData(res: Response){
        let detail = res.json();
        console.log(detail.post);
        return detail.post;

  }
  handleError(error: any):ErrorObservable{
    console.error('Servor Error!', error);
    return Observable.throw(error || 'Server Error');
  }

我通过使用elvis运算符解决了它，但我需要知道是否有更好的方法来删除此错误，因为我需要在html文件中的很多地方进行属性绑定。

Answer 1

在呈现视图时，post数据尚未定义，因为您仍在等待获取视图。您可以使用?运算符或将其包装在*ngIf

中

{{post?.title}}

// OR

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

在Ionic 2中渲染远程数据的问题

1 个答案: