angular2テンプレートに非同期オブジェクトをレンダリング

Question

私が持っているテンプレート：

<div class="container"> 
<div class="jumbotron text-center"> 
    <h1>{{user && user.displayName}}</h1> 
    <p>How is your day, today??</p> 
    <mood-meter [current]="user && user.currentMood" 
       (onChange)="moodChanged(value)"></mood-meter> 
</div> 

私はこれらすべての& &演算子をオフに取り除くことができますどのように？観察可能なものが解決されると、ユーザーが設定されます。

非同期パイプはオブジェクトではうまく機能しません。あなたはどうやってそれを扱いますか？

Answer 1

あなたが解決される観測可能な使用している場合は、すぐ下の行を置き換える

<h1>{{user && user.displayName}}</h1> 

<mood-meter [current]="user && user.currentMood"(onChange)="moodChanged(value)"></mood-meter>

<h1>{{user && user?.displayName}}</h1> 

<mood-meter [current]="user && user?.currentMood"(onChange)="moodChanged(value)"></mood-meter> 

と交換私はちょうど置きます '？'ユーザーオブジェクトの後で、オブジェクト変更データを非同期的に更新し続けます。