Проблемы рендеринга удаленных данных в ионическом 2

Question

Я создаю макет ионного проект, где мне нужно, чтобы отобразить пост детали, все работает отлично, за исключением, когда я пытаюсь сделать свойство после объекта, как

{{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'); 
 
    }

Я решил его с помощью оператора Элвиса, но мне нужно знать, есть ли лучший способ, чтобы удалить эту ошибку так как мне нужно сделать привязку свойств во множестве мест в html-файле.

Answer 1

Данные post еще не определены при визуализации представления, поскольку вы все еще ожидаете его получения. Вы можете либо использовать оператор ?, либо обернуть его в *ngIf

{{post?.title}} 

// OR 

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