如何在单击离子幻灯片时显示所需的页面，以便页眉和页脚应与包含离子幻灯片的页面相同？

Question

<ion-footer>
    <ion-toolbar style="width:100%;">

        <ion-row class="filters">
            <ion-col class="col-with-arrow" (click)="slidePrev()" no-padding col-1>
                <ion-icon *ngIf="showLeftButton" name="arrow-back"></ion-icon>
            </ion-col>
            <ion-col no-padding col-10>

                <ion-slides (ionSlideDidChange)="slideChanged()" slidesPerView="5"  #slideOptions  [initialSlide]="1" >


                    <ion-slide  *ngFor = "let category of categories" >
                        <ion-icon (click)="filterData(category.id)" name="{{category.icon}}"[class.selected]="selectedCategory?.id === category.id"></ion-icon>
                    </ion-slide>
                </ion-slides>
            </ion-col>
            <ion-col class="col-with-arrow" (click)="slideNext()" no-padding col-1>
                <ion-icon *ngIf="showRightButton" name="arrow-forward"></ion-icon>
            </ion-col>
        </ion-row>


        </ion-slides>
    </ion-toolbar>

</ion-footer>

我想通过单击幻灯片来显示所需的页面，但是所有所需页面的父页面的页眉和页脚应该相同。