PrimeNg TurboTable - 条件 Row-grouping

Question

我正在使用 PrimeNG 的 TurboTable (p-table)

我有一个 groupField 参数，它可以是 null 或具有对应于列 header 的值。该参数的值可以随时动态更改。预期的行为是，当 groupField==null 呈现正常 table 但当 'groupField==` 时，行将根据此值进行分组，如 here.

所示

我想按照 here 所述实施行分组，其中 table 响应 groupField 参数中的更改。

我试过的：

用pTemplate="body"做两个ng-templates，像这样。

<ng-template pTemplate="body" *ngIf="groupField==null">
    ...
<ng-template>
<ng-template pTemplate="body" *ngIf="groupField!=null">
    ...
<ng-template>
<ng-template pTemplate="rowexpansion" *ngIf="groupField!=null">
    ...
<ng-template>

这 不起作用 因为我怀疑 p-table 在首次呈现时形成其配置，随后仅更新数据。

制作两个不同的 <p-table>s，一个有行分组，另一个没有，用 ngIf 来控制在给定时间显示哪一个。这个有效但对我来说没有意义，因为我应该能够在一个 table 中做到这一点，就像我在旧的 <p-datatable> 中能够做到的那样。 =43=]

我想要一个 table 处理所有这些。

Answer 1

您可以在 <p-template> 中添加一个 <ng-container>，这样它看起来像这样：

<ng-template pTemplate="body">
   <ng-container *ngIf="groupField==null">
    ...
   </ng-container>
   <ng-container *ngIf="groupField!=null">
    ...
   </ng-container>
<ng-template>
<ng-template pTemplate="rowexpansion" *ngIf="groupField!=null">
    ...
<ng-template>

您可以在此处检查它的工作情况：

https://stackblitz.com/edit/angular-primeng-stack-55706959?file=src/app/ils-tree/ils-tree.component.ts

有一个 groupField，您可以在 tablegrouping.component.ts 中将其从 true 更改为 false 以检查它是如何工作的。

PrimeNg TurboTable - 条件 Row-grouping

PrimeNg TurboTable - Conditional Row-grouping

primeng

angular

primeng-datatable

primeng-turbotable