How to achieve a separate row at the top of a PrimeNG p-table containing custom content?

Question

I am attempting to create a table layout using the p-table component where there is an additional row displayed at the top of the table, separate from the rows generated by the ng-template for the items in my array. This additional row should contain custom content and should not be affected by the iteration over my array.

The function of the seperate row would be a bulk setting possibility, where the values set in the dropdowns of the row would set the values of all of the rows in the table. I know it would be easy to place this setting outside of the table, but I would like to know if it could be inside the body of the table somehow.

<p-table [value]="exampleSettings" (onRowReorder)="onExampleChange()">
    <ng-template pTemplate="header">
      <tr>
        <th class="col-1"></th>
        <th class="col-2">{{ 'Settings.ExampleTable.Name' | translate }}</th>
        <th class="col-3">{{ 'Settings.ExampleTable.Resolution' | translate }}</th>
        <th class="col-2">{{ 'Settings.ExampleTable.Groups' | translate }}</th>
        <th class="col-2">
          {{ 'Settings.ExampleTable.Visible' | translate }}
        </th>
      </tr>
    </ng-template>

    //  THIS IS THE ROW I'D LIKE TO DISPLAY INSIDE THE BODY
    <tr *ngIf="ExampleSettings">
      <td></td>
      <td></td>
      <td>
        <p-dropdown
          *ngIf="resolutionOptions"
          [options]="resolutionOptions"
          (onChange)="onBulkChange($event, 'resolution')">
          <ng-template pTemplate="selectedItem">
            Select
          </ng-template>
          <ng-template let-resolutionOptions pTemplate="item">
            {{ 'ExampleSettings.resolution.' + resolutionOptions | translate }}
          </ng-template>
        </p-dropdown>
      </td>
      <td></td>
    </tr>

    <ng-template pTemplate="body" let-item let-index="rowIndex">
      <tr [pReorderableRow]="index" draggable="true">
        <td>
          <i class="pi pi-bars"
             [pReorderableRowHandle]="index">
          </i>
        </td>
        <td>
          {{ item.example }}
        </td>
        <td>
          <p-dropdown
            *ngIf="resolutionOptions"
            [options]="resolutionOptions"
            (onChange)="onExampleChange()"
            [(ngModel)]="item.resolution">
            <ng-template pTemplate="selectedItem">
              {{ 'ExampleSettings.Resolution.' + item.resolution | translate }}
            </ng-template>
            <ng-template let-resolutionOptions pTemplate="item">
              {{ 'ExampleSettings.Resolution.' + resolutionOptions | translate }}
            </ng-template>
          </p-dropdown>
        </td>
        <td>
          <p-dropdown
            *ngIf="exampleGroupingOptions"
            [options]="exampleGroupingOptions"
            (onChange)="onExampleChange()"
            [(ngModel)]="item.grouping">
            <ng-template pTemplate="selectedItem">
              {{ 'ExampleSettings.ExampleGrouping.' + item.grouping | translate }}
            </ng-template>
            <ng-template let-ExampleGroupingOptions pTemplate="item">
              {{ 'ExampleSettings.ExampleGrouping.' + ExampleGroupingOptions | translate }}
            </ng-template>
          </p-dropdown>
        </td>
        <td>
          <p-inputSwitch
            [(ngModel)]="item.visible"
            (onChange)="onExampleChange()">
          </p-inputSwitch>
        </td>
      </tr>
    </ng-template>
  </p-table>

I've attempted to achieve this by placing the additional row outside of the ng-template body within the p-table structure, both with and without the use of ng-container, but the content of the additional row is not being displayed. I'm seeking assistance in achieving this desired layout and behavior within the p-table component.