具有动态行和列的angular2表

如何在angular2中创建具有动态列和行的表

我有来自rest服务的数据，并在这个可观察的

this._physicalDataService.getPhysicalData().subscribe(res=> this.data = res)

我可以通过这段代码动态显示行。如何使列和列标题也是动态的，即如何提取数组中的所有JSON键以在顶部放置另一个循环

为了澄清这一点，我的后端服务可能返回具有不同列和行的不同数据集，我希望在页面上动态显示它们

               <thead class="no-bd">
                        <tr>
                          <th>Id</th>
                          <th>Number</th>
                          <th >Employee Name</th>
                          <th >Manager Name</th>
                        </tr>
                        </thead>

                        <tbody>

                        <tr *ngFor="let tablerows of data">
                          <td>
                          {{tablerows.row_id}}
                          </td>
                          <td>{{tablerows.number}}</td>
                          <td >{{tablerows.employee_name}}</td>
                          <td >{{tablerows.manager_name}}
                          </td>
                        </tr>

身份证件
数
员工姓名
经理姓名
{{tablerows.row_id}
{{tablerows.number}
{{tablerows.employee_name}
{{tablerows.manager_name}
您也可以在
上使用相同的*ngFor

但为此，您需要计算对象的长度，它不会给您每个数组中的元素数目

var custObject = new Object();
myArray["firstname"] = "Gareth";
myArray["lastname"] = "Simpson";
myArray["age"] = 21;
this.objLength = Object.keys(myArray).length;  // Calc length of Object i.e. 3

确定对象的长度后，可以使用以下管道多次渲染
块：

<th *ngFor='#key of 5 | demoNumber;let i=index'>
Column{{i}}
</th>


列{{i}

管道：

从'angular2/core'导入{Pipe，PipeTransform}；
@管道（{name:'demoNumber'}）
导出类DemoNumber实现了PipeTransform{
转换（值，参数：字符串[]）：任意{
设res=[]；
for（设i=0；i

这将计算对象字段的数量&然后ngFor将为每个字段呈现Coulmn+索引

希望这有帮助。
谢谢。这些提示帮助很大。我明白了working@SaurabhVerma很高兴听到这个消息。如果问题已解决，请通过接受答案来结束问题
import {Pipe, PipeTransform} from 'angular2/core';

@Pipe({name: 'demoNumber'})
export class DemoNumber implements PipeTransform {
  transform(value, args:string[]) : any {
    let res = [];
     for (let i = 0; i < value; i++) {
        res.push(i);
     }
    return res;
  }
}