Angular2嵌套NGF

我需要在Angular2中做一个类似的操作：

---

我有一个可能与您想要的类似的示例：

<table id="spreadsheet">
    <tr *ngFor="let row of visibleRows">
        <td class="row-number-column">{{row.rowIndex}}</td>
        <td *ngFor="let col of row.columns">
            <input  data-id="{{col.rowIndex}}-{{col.columnIndex}}" [value]="col.cellValue" (input)="col.cellValue = $event.target.value" (click)="model.selectColumn(col)" (keyup)="navigate($event)" />
        </td>
    </tr>
</table>


{{row.rowIndex}}

我使用它来呈现一个电子表格格式，如图所示：
使用ngFor语法的“模板”形式，如图所示。它比更简单的
*ngFor
版本要详细一点，但这就是在不输出html的情况下实现循环的方法（除非您愿意）。一个例外：你仍然会在
中得到html注释，但我希望这没问题。这是一个有效的例子：

@组件({
选择器：“我的应用程序”，
提供者：[]，
指令：[]，
模板：`
{{child}}
`
})
导出类应用程序{
私人物品：字符串[][]=[
{儿童：['foo1'，'bar1'，'baz1']}，
{儿童：['foo2'，'bar2'，'baz2']}，
{儿童：['foo3'，'bar3'，'baz3']}，
]
}
如果需要两个或多个foreach循环来绘制表中的行，则需要执行以下类似操作

<template ngFor let-rule [ngForOf]="model.rules" let-ruleIndex="index">
    <template ngFor let-clause [ngForOf]="rule.clauses" let-clauseIndex="index">
        <tr>
            <td>{{clause.name}}</td>
        </tr>
    </template>
</template>    


{{clause.name}
我只是尝试显示数据库中任何表的数据。我是这样做的：

我对table.component.ts中API的TypeScript Ajax调用：

http.get<ITable>(url, params).subscribe(result => {
  this.tables = result;
}, error => console.error(error));

http.get（url，参数）.subscribe（结果=>{
这个表=结果；
}，error=>console.error（error））；

我的爱好

 interface ITable {
  tableName: string;
  tableColumns: Array<string>;
  tableDatas: Array<Array<any>>;
}

interface-ITable{
tableName:string；
表列：数组；
表数据：数组；
}

My table.component.html

<table class='table' *ngIf="tables">
  <thead>
    <tr>
      <th *ngFor="let tableColumn of tables.tableColumns">{{ tableColumn }}</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let tableData of tables.tableDatas">
      <td *ngFor="let data of tableData">{{ data }}</td>
    </tr>
  </tbody>
</table>


{{tableColumn}}
{{data}}
模板对我不起作用，但使用ngForOf的ng模板可以实现以下目的：

<ng-template ngFor let-parent [ngForOf]="parent" >
    <tr *ngFor="let child of parent.children">
        <td>
            {{ child.field1 }}
        </td>
        <td> 
            {{ child.field2 }}
        </td>
        <td> ... and so one ... </td>
    </tr>
</ng-template>


{{child.field1}}
{{child.field2}}
... 所以有一个。。。
在HTMLP中使用ng repeat可以嵌套ng repeat吗？那里在angular2中没有ng重复？你建议切换到angular 1.x吗？它不是我编辑的，而是另一个人编辑的。最初的问题版本Angular2的表述是现在的两倍。我不确定Angular如何处理这个问题，但IE删除了
中的
标记。这只是编译前的一个问题。编译之后，实际上写入DOM的只是模板和一些作为模板锚的子html注释。但模板本身不会在运行时插入。（至少据我所知）。因此，只要允许在内部添加注释，它就可以工作。更新的语法是Thank you sir@tght链接已失效
<ng-template ngFor let-parent [ngForOf]="parent" >
    <tr *ngFor="let child of parent.children">
        <td>
            {{ child.field1 }}
        </td>
        <td> 
            {{ child.field2 }}
        </td>
        <td> ... and so one ... </td>
    </tr>
</ng-template>