Header and Footer Visibility

Hey there! Im currently developing an App and i wanted to ask if there is a good way to solve that.
I want to have the Header and the Footer only in specific pages.
Currently my app.component.ts is looking like this. How can i set the headerVisible and footerVisible depending on the page coming from the router-outlet?

  <app-header *ngIf="headerVisible"></app-header>
  <app-navigation *ngIf="footerVisible"></app-navigation>

Thanks for your Answer in Advance :slight_smile:

Use ion-header in ion-footer components in every page you want instead of this method