【问题标题】:Unable to load data for nested table dynamically无法动态加载嵌套表的数据
【发布时间】:2019-01-15 10:05:16
【问题描述】:

我使用来自 ``ng-zorro` 的组件 nztable 创建了一个表。该表包含一个嵌套表,我想在单击展开图标时动态加载数据(REST 服务调用)。

我能够加载嵌套表中的数据,但是当我展开下一行时,它会用新结果覆盖第一行中的数据。

由于嵌套表创建是在循环中(ngfor),我无法控制数据绑定到特定行。

<nz-table #nestedTable [nzData]="displayData" [nzPageSize]="10">
    <thead colspan="5">
    <tr>
      <th nzWidth="4%"nzShowExpand></th>
      <th nzWidth="12%">Id</th>
      <th nzWidth="10%">Start Time</th>
      <th nzWidth="10%">End Time</th>
      <th nzWidth="10%">Status</th>
    </tr>
    </thead>
    <tbody>
    <ng-template ngFor let-data [ngForOf]="nestedTable.data">
      <tr>
        <td nzShowExpand [(nzExpand)]="data.expand" (click)="getDetails(data)"></td>
        <td >{{data.Id}}</td>
        <td>{{data.startTime}}</td>
        <td>{{data.endTime}}</td>
        <td>{{data.status}}</td>
      </tr>
      <tr [nzExpand]="data.expand">
        <td><nz-spin  *ngIf="isEventLoading"></nz-spin></td>
        <td colspan="9">
          <nz-table #innerTable [nzData]="innerTableData" nzSize="middle" [nzShowPagination]="false">
    <thead>
    <tr>
      <th>E ID</th>
      <th>S ID</th>
      <th>E Type</th>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let data of innerTable.data">
      <td>{{data.eID}}</td>
      <td>{{data.sID}}</td>
      <td>{{data.eType}}</td>
    </tr>
    </tbody>
    </nz-table>

【问题讨论】:

  • 如果有的话,请考虑添加一些相关的代码和错误信息。目前的形式尚不清楚究竟是什么问题。
  • @suvartheec:没有错误。此问题与动态加载嵌套表数据有关。它正在向所有孩子加载相同的数据。

标签: ng-zorro-antd


【解决方案1】:

尝试用你的内部收藏替换这个[nzData]="innerTableData",就像这样[nzData]="data.childRows"

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-10-01
    • 1970-01-01
    • 1970-01-01
    • 2015-02-06
    • 2012-03-31
    • 2016-08-31
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多