Splitter

Splitter is utilized to separate and resize panels.

Import #


import { SplitterModule } from 'primeng/splitter';

Splitter requires two SplitterPanel components as children which are displayed horizontally by default.

Panel 1

Panel 2


<p-splitter [style]="{ height: '300px' }" styleClass="mb-5">
    <ng-template pTemplate>
        <div class="col flex align-items-center justify-content-center">Panel 1</div>
    </ng-template>
    <ng-template pTemplate>
        <div class="col flex align-items-center justify-content-center">Panel 2</div>
    </ng-template>
</p-splitter>