エラーは、私がループ内でいくつかのデータをレンダリングしたいAngular2

Question

に* ngForループをINGの：

<div *ngFor="let data of parameters.items.tableConfig.nodes"> 
    <table-item [data]=data></table-item> 
    </div> 

しかし、データ

そして、私が持っているエラー：私はデータの前に

EXCEPTION: Error in ./TableWidgetComponent class TableWidgetComponent - inline template:7:17 caused by: Cannot read property 'nodes' of undefined 

待つことができますどのように来てから、ビューをレンダリングしますか？

*ngIf="parameters && parameters.items.tableConfig.nodesは「私を助けていません。データが非同期に来ている場合に有益で、それはエラーをスローするように、角度防ぐことができます[もsafe navigation operator呼ば] elevisにオペレータ(?)を使用してこの

<div *ngFor="let data of parameters?.items?.tableConfig?.nodes"> 
    <table-item [data]=data></table-item> 
    </div> 

Answer 1

使用あなたの場合のように

これについての詳細情報はこちら

https://angular.io/docs/ts/latest/guide/template-syntax.html#!#safe-navigation-operator

Answer 2

「データが来る前に私がどのように待つことができるか」と言うと、私はデータを非同期呼び出しから取り出します。したがってObservableかPromiseのどちらかですここにはいくつかのオプションがあります。

if-conditionを実際のループの周りに追加します。

<div *ngIf="parameters.items.tableConfig">...</div>

safe navigation operatorを使用してください（？）undefinedとnullを防ぐために。

<div *ngFor="let data of parameters.items.tableConfig?.nodes"> 
    <table-item [data]=data></table-item> 
</div> 

async pipeを使用してください。

PromiseまたはObservableを受け取り、Promiseが解決されたとき、またはObservableが新しい値を出すときに、応答データでビューを更新します。

export class MyComponent { 
    nodePromise: Promise<Node>; // e.g. with Promise. 
} 

<div *ngFor="let data of nodePromise | async"> 
    <table-item [data]=data></table-item> 
</div>