Angular: сохранить все вкладки, как есть, при нажатии на сохранить

Question

У меня есть 3 вкладки с общей кнопкой сохранения. Одна из вкладок имеет дополнительные 3 вкладки.

<div class="col-sm-12">
    <ul class="nav nav-tabs">
        <li class="nav-item">
            <a href="javascript:void(0)" class="link nav-link"
                    [ngClass]="{'active': selectedTab === 'Tab1'}"
                    (click)="selectedTab = 'Tab1'">Tab1</a>
        </li>
        <li class="nav-item">
            <a href="javascript:void(0)" class="link nav-link"
                    [ngClass]="{'active': selectedTab === 'Tab2'}"
                    (click)="selectedTab = 'Tab2'">Tab2</a>
        </li>
        <li class="nav-item">
            <a href="javascript:void(0)" class="link nav-link"
                    [ngClass]="{'active': selectedTab === 'Tab3'}"
                    (click)="selectedTab = 'Tab3'">Tab3</a>
        </li>
    </ul>
</div>

Когда я заполняю некоторые данные на одной из этих вкладок и нажимаю «Сохранить», все сводится к минимуму. И чтобы просмотреть сохраненные данные, я должен снова открыть все. Общая кнопка сохранения выглядит следующим образом:

<div class="btn-group-sm mr-2" *ngIf="!readOnly">
    <button type="button" class="btn btn-primary btn-sm" (click)="save()">Save</button>
</div>

Я хотел бы сохранить состояние вкладки, когда я нажимаю на сохранение, т.е. состояние страницы до сохранения и после сохранения должно быть одинаковым. Любые идеи о том, как я могу это сделать?