如何在PrimeNG数据表上进行动态行分组？

import { Component, OnInit } from '@angular/core';
import { Table } from 'primeng/table';
import { PrimeNGConfig } from 'primeng/api';

export class YourComponent implements OnInit {
  constructor(private primengConfig: PrimeNGConfig) {}

  ngOnInit() {
    this.primengConfig.ripple = true;
  }
}

<p-table [value]="yourData" [rows]="10" [paginator]="true" [rowsPerPageOptions]="[5,10,20]">
  <ng-template pTemplate="header">
    <tr>
      <th>Column 1</th>
      <th>Column 2</th>
      <th>Column 3</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-rowData let-rowIndex="rowIndex">
    <tr [pRowToggler]="rowData">
      <td>{{rowData.column1}}</td>
      <td>{{rowData.column2}}</td>
      <td>{{rowData.column3}}</td>
    </tr>
    <tr [pRowToggler]="rowData" [pRowSpan]="rowData.subRows.length" *ngFor="let subRow of rowData.subRows">
      <td>{{subRow.column1}}</td>
      <td>{{subRow.column2}}</td>
      <td>{{subRow.column3}}</td>
    </tr>
  </ng-template>
  <ng-template pTemplate="rowexpansion" let-rowData>
    <tr>
      <td colspan="3">
        <p-table [value]="rowData.subRows">
          <ng-template pTemplate="body" let-subRow>
            <tr>
              <td>{{subRow.column1}}</td>
              <td>{{subRow.column2}}</td>
              <td>{{subRow.column3}}</td>
            </tr>
          </ng-template>
        </p-table>
      </td>
    </tr>
  </ng-template>
</p-table>

export class YourComponent implements OnInit {
  yourData: any[];

  ngOnInit() {
    this.yourData = [
      {
        column1: 'Value 1',
        column2: 'Value 2',
        column3: 'Value 3',
        subRows: [
          {
            column1: 'Sub Value 1',
            column2: 'Sub Value 2',
            column3: 'Sub Value 3'
          },
          {
            column1: 'Sub Value 4',
            column2: 'Sub Value 5',
            column3: 'Sub Value 6'
          }
        ]
      },
      // Add more data rows here...
    ];
  }
}