角度2複雑な補間プロパティ

Question

column.valueは、単純な値を持っている場合、私は、オブジェクトのプロパティが正しく、このコードを使用してコンポーネント

<tr *ngFor="let row of dataset"> 
    <td *ngFor="let column of columns">{{row[column.value]}}</td> 
</tr> 

が表示されていますが、値は、このような複雑な価値を持っている場合、それは表示されません。 property.nestedpropertyとなります。

問題を解決するにはどうすればよいですか？

ありがとうございました。

Answer 1

私はこの問題に何度も直面していますが、これを回避する最良の方法は、すべてのロジックを計算して配置するgetColumnValue（）というコンポーネントのメソッドを宣言することです。あなたのコンポーネントクラス で ...

getColumnValue(){ 
    //logic to get the column value 
    return value 
} 

が続い <td> のinnerHTMLの属性にこの方法をバインドするので、代わりに

<td *ngFor="let column of columns">{{row[column.value]}}</td> 

の使用は

<td *ngFor="let column of columns" [innerHtml]="getColumnValue()"> </td> 

これは、取得するための最も簡単な方法です一般的なコンポーネントまたはディレクティブまたは子コンポーネントの作成などがあります。 しかし、私は上記を最も明確かつ簡潔に信じています。