未定義のプロパティ 'user'を読み取ることができません

Question

私は応答からデータを読み込み、HTMLで設定しようとしています。しかし、私には未定義のエラーが出ています。誰でも私がここで間違っていることを助けることができますか？

後は、コンポーネントの抜粋です：

userProfile: any 
constructor(private _userProfileService: UserProfileService){} 

ngOnInit(){ 
this._userProfileService.getProfileData() 
.subscribe(data => { 
    console.log("Response"); 
    console.log(data); 
      this.userProfile = data; 
      console.log(this.userProfile.user.firstname); 
     }); 

}

HTML：

<h2>{{userProfile.user.firstname}} {{userProfile.user.lastname}}'s Profile <a href="#"><img src="assets/img/pen.png" alt="pen"></a></h2> 

Answer 1

安全オペレータこのラインで固定

<div *ngIf='userProfile?.user'> 
<h2>{{userProfile.user.firstname}} {{userProfile.user.lastname}}'s Profile <a href="#"><img src="assets/img/pen.png" alt="pen"></a></h2> 
</div> 

Answer 2

問題：

は、あなたがにその利用できる前に、データを表示しようとしているのでビュー。

は、これを試してください

<div *ngIf='userProfile?.user'> 
<h2>{{userProfile.user.firstname}} {{userProfile.user.lastname}}'s Profile <a href="#"><img src="assets/img/pen.png" alt="pen"></a></h2> 
</div>