Angular2嵌套ngFor。嵌套表达式可能吗?

时间:2016-12-22 00:34:46

标签: angular expression 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>

1 个答案:

答案 0 :(得分:4)

像这样使用:

{{ row[col.Data] }}

在Javascript中,您也可以通过obj.propNameobj[propName]访问每个媒体资源!