Angular 在单击时动态加载组件数组

动态加载组件时遇到问题

我实现angular的动态组件加载器的方式与他们文档中所需的方式相同：

我要做的是为每个动态组件创建一个ng for循环

<ng-container *ngFor="let rowData of TableData">
  <tbody [attr.data-index]="rowIndex">
    <tr click="loadComponentForIndex()">Some Data</tr>
    <ng-container *ngIf="isRowShown(rowIndex)">
      <ng-template dynamicallyLoadedComponent></ng-template>
    <ng-container>
  </tbody>
</ng-container>

一些数据

问题是，当我单击任何表行时，只有第一个组件被实例化

当前结果：

一些数据
动态加载组件
一些数据
一些数据
一些数据
一些数据
一些数据

所需结果：单击第2行和第6行：

---

一些数据
一些数据
动态加载组件
一些数据
一些数据
一些数据
一些数据
动态加载组件
一些数据
一些数据
一些数据
一些数据
一些数据
试试这个，这对我来说很好

  <tbody *ngFor="let rowData of TableData;let i=index">
    <tr (click)="hideme[i] = !hideme[i]">Some Data</tr>
    <tr [hidden]="hideme[i]">{{getContent()}}</tr>
  </tbody>

---

检查这个

试试这个，这个对我很好用

  <tbody *ngFor="let rowData of TableData;let i=index">
    <tr (click)="hideme[i] = !hideme[i]">Some Data</tr>
    <tr [hidden]="hideme[i]">{{getContent()}}</tr>
  </tbody>

检查这个