Show back button on specific page

Question

I work on Ionic v3 app and I'm trying to do something.

I've a HomePage with:

<ion-header>
    <ion-navbar>
        <ion-buttons *ngIf="showBackBtn" left>
            <button ion-button icon-only class="my-style-for-modal">
                <ion-icon name="arrow-back"></ion-icon>
            </button>
        </ion-buttons>
        <ion-title>
            {{ ttttt }} - {{ eeee }}
        </ion-title>
    </ion-navbar>
</ion-header>

<ion-tabs #globalTabs>
    <ion-tab [root]="page1" tabTitle="1"></ion-tab>
    <ion-tab [root]="page2" tabTitle="2 avis"></ion-tab>
    <ion-tab [root]="page3" tabTitle="3"></ion-tab>
    <ion-tab [root]="page4" tabTitle="4"></ion-tab>
    <ion-tab [root]="page5" tabTitle="5"></ion-tab>
</ion-tabs>

In my Page1, I've:

<ion-content class="has-header" padding>
    <ion-list >
        <button ion-item (click)="menuSelected('test')">
            {{ 'Test' | translate }}
        </button>  
        <button ion-item (click)="logout()">
            {{ 'Logout' | translate }}
        </button> 
    </ion-list>
</ion-content>

When I click on button 'Test' I do this.nav.push(TestPage); And I want on this page to show the hide button of the HomePage header changing the showBackBtn value.

Is it possible?

Answer 1

Create a method to change showBackBtn value on HomePage.ts:

showBackButton(): void {
  this.showBackBtn = true;
}

Then you can inject the HomePage on TestPage.ts and call the method:

export class TestPage {
  constructor(
    @Inject(forwardRef(() => HomePage)) private homePage: HomePage
  ) {
    this.homePage.showBackButton();
  }   

}