The rows can be grouped on a specific field in such a way that rows can be expanded and collapsed using row expander feature. This feature is enabled by setting rowGroupMode="subheader", expandableRowGroups="true", and groupField="browser". groupField is set to a specific categorized column.

The row grouping feature with expandable row group option would be written as follows:

<p-dataTable [value]="browsers" sortField="browser"  
  rowGroupMode="subheader"  groupField="browser"  
  expandableRowGroups="true" [sortableRowGroup]="false">
  <p-header>Toggleable Row Groups with Footers</p-header>
  <ng-template pTemplate="rowgroupheader" let-rowData> 
    {{rowData['browser']}}
  </ng-template>
  <p-column field="engine" header="Engine"></p-column>
  <p-column field="platform" header="Platform"></p-column>
  <p-column field="rating" header="rating">
    <ng-template let-col let-browser="rowData" pTemplate="body">
      <span>{{browser[col.field]}} 'Stars'</span>
    </ng-template>
  </p-column>
  <ng-template pTemplate="rowgroupfooter" let-browser>
    <td colspan="3" style="text-align:right">Chrome browsers are not 
      included</td>
  </ng-template>
</p-dataTable>

The following screenshot shows a snapshot result of the expandable row grouping feature as an example:

In this use case, we expanded Firefox version 3 group to see all the browser details over time.