テンプレート内に単一のオブジェクトを表示する方法

Question

NgForを使用してテンプレート内のオブジェクトのリストをレンダリングする方法を知っていますが、配列にない単一のオブジェクトの表示に関する情報は見つかりません。

私は私のProfileServiceにを通じて、ユーザープロファイルを返すAPIエンドポイントを持っている：

find() { 
    return this.http.get('/api/user/22/profile.json'); 
} 

私のコンポーネントは、このような設定である：私のテンプレートでは

export class ProfileListComponent implements OnInit { 
    profile: any; 

    constructor(private profileService: ProfileService) { } 

    loadProfile() { 
    this.profileService.find() 
     .subscribe(response => this.profile = response.json()); 
    } 

    ngOnInit() { 
    this.loadProfile(); 
    } 

} 

、私はしたくありませんNgForを使用するには、次のようなプロファイルの属性を表示したいだけです。

{{ profile.name }} 

どのようにすればいいですか？今のところ、プロファイルが存在しないかのように、定義されていないエラーが発生します。

Answer 1

profileフィールドは、http応答が戻ってそれを初期化するコールバックが呼び出されるまで、未定義のままです。そういうわけで、あなたはそのエラーを受けます。 ngIfを使用して、プロファイルがまだ表示されていないときには表示されないようにするか、