Как сохранить выбранные столбцы в памяти?

Question

Существует компонент Columns, который позволяет выбрать, какой столбец отображать в таблице, а какой нет.

<mat-form-field>
  <mat-label>Columns</mat-label>
  <mat-select [(ngModel)]="activeCols" multiple>
    <mat-option *ngFor="let c of allCols" [value]="c">{{ c }}</mat-option>
  </mat-select>
</mat-form-field>

Как предотвратить сброс ранее выбранных столбцов для таблицы при обновлении страницы?

Проект на stackblitz

Answer 1

Вы можете использовать localStorage для сохранения ваших данных.Вот это stackblitz .Больше информации здесь Документы

Answer 2

Я предлагаю использовать Локальное хранилище , таким образом вы сможете сохранить данные после обновления

Свойство localStorage, доступное только для чтения, позволяет получить доступ к хранилищуобъект для происхождения документа;сохраненные данные сохраняются между сеансами браузера.localStorage аналогичен sessionStorage, за исключением того, что, хотя данные, хранящиеся в localStorage, не имеют срока действия, данные, хранящиеся в sessionStorage, очищаются по окончании сеанса страницы, то есть при закрытии страницы.

Следует отметить, чтоданные, хранящиеся в localStorage или sessionStorage, зависят от протокола страницы.

Ключи и значения всегда являются строками (обратите внимание, что, как и в случае объектов, целочисленные ключи будут автоматически преобразованы в строки).

Вот пример того, как сохранить данные в локальном хранилище:

localStorage.setItem("myActiveColumns", activeCols);