2016-12-22 38 views
2

私は式バインディングで値を使用しようとしています。私はこれが有効ではないが、同様のことが可能かどうかを知りたいと思う。もしそうでなければ、別の方法でそれについて行きますか?Angular2ネストされたngFor。入れ子式は可能ですか?

import { Component, OnInit } from '@angular/core'; 

@Component({ 
selector: 'Home', 
templateUrl: './views/home/home.html' 
}) 
export class HomeComponent implements OnInit{ 

    rows = [ 
     { 'FirstName': 'John', 'LastName': 'Doe' }, 
     { 'FirstName': 'Ashley', 'LastName': 'Doe' } 
    ]; 

    cols = [ 
     { 'Desc': 'First Name', 'Data': 'FirstName' }, 
     { 'Desc': 'Last Name', 'Data': 'LastName' } 
    ]; 
} 

home.html

<table> 
    <thead> 
    <tr> 
     <th *ngFor="let col of cols">{{col.Desc}}</th> 
    </tr> 
    </thead> 
    <tr *ngFor="let row of rows">  
    <td *ngFor="let col of cols"> 
     {{row.{{col.Data}}}}  
    </td> 
    </tr> 
</table> 
+0

'{{}}'をネストしないでください。 –

答えて

4

はこのようにそれを使用してください:JavaScriptで

{{ row[col.Data] }} 

あなたも、obj.propNameobj[propName]を経由してすべてのプロパティにアクセスすることができます!

+0

輝かしい。ありがとうございました。 – user1347790

関連する問題