angular6+ng-zorro实现表格树形数据展示

kksw1121

于 2019-03-30 11:24:15 发布

阅读量5.3k

点赞数

文章标签： angular6 ng-zorro表格树形数据

本文链接：https://blog.youkuaiyun.com/qq_43225030/article/details/88909371

版权

本文详细介绍了如何在Angular6项目中使用ng-zorro库来实现表格数据的树形展示，包括数据加载、层级展开与收起、节点操作等功能，为开发者提供了一种高效的数据组织方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<nz-table #expandTable [nzData]="listOfMapData">
    <thead>
      <tr>
        <th nzWidth="40%">ID</th>
        <th nzWidth="30%">NAME</th>
        <th>COUNT</th>
      </tr>
    </thead>
    <tbody>
      <ng-container *ngFor="let data of expandTable.data">
        <ng-container *ngFor="let item of mapOfExpandedData[data.key]">
          <tr *ngIf="item.parent && item.parent.expand || !item.parent">
            <td
              [nzIndentSize]="item.level * 20"
              [nzShowExpand]="!!item.childKey"
              [(nzExpand)]="item.expand"
              (nzExpandChange)="collapse(mapOfExpandedData[data.key],item,$event)">
              {
  {item.id}}

最低0.47元/天解锁文章