Как сохранить измененное состояние столбца, так как оно изменяется на вкладке в угловом 5 с помощью ptable?

Я хочу сохранить измененные столбцы при изменении вкладок, я сохранил модель динамических колонок и рендеринг выбранных столбцов:

      <p-table #dt [columns]="selectedColumns" [scrollable]="true" [rows]="data.totalNoOfRowss" [virtualScroll]="true" (onLazyLoad)="loadDataOnScroll($event)" scrollHeight="100%" [value]="data.searchVos" sortMode="single" [responsive]="true"  [lazy]="true" [totalRecords]="data.totalNoOfRows" [virtualRowHeight]="50.8" >
        <ng-template pTemplate="caption">

        </ng-template>  
        <ng-template pTemplate="header">
              <tr class="height-85" (mouseup)="setForSortFlag()">
                  <th *ngFor="let col of selectedColumns"  style="color: rgb(51, 51, 51) !important;" pResizableColumn [pSortableColumn]="col.field" class="back-white  border-unset header-property pad-14-4 active">
                      {{col.header}}
                      <p-sortIcon [field]="col.field" class="header-property"></p-sortIcon>
                  </th>
              </tr>
          </ng-template>
          <ng-template pTemplate="body" let-log>
              <tr class="log-row">
                  <td *ngFor="let col of selectedColumns" style="color: rgb(51, 51, 51) !important;" class="ui-resizable-column border-top-td header-property" >
                    <span >{{log[col.field]}}</span>
                  </td>
              </tr>
          </ng-template>
      </p-table>

Как мы можем сохранить измененное состояние столбца на вкладке и изменить значение на ptable, пока рендеринг его снова?