Generated back button click event in a sideMenu

[jeandemagny]

I try to generate a back button click calling automatically setBackButtonAction() method. I have a ion-segment in a side menu and so when i open the menu i would like to call setBackButtonAction() to click on the “segment2” button.

side menu in app.html :

    <ion-menu [content]="content" side="left" id="menuParameter">
    <ion-header>
        <ion-toolbar color="default">
            <ion-segment [(ngModel)]="segmentSelected" >                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            
                <ion-segment-button value="s1">
                  segment 1
                </ion-segment-button>
                <ion-segment-button value="s2"  click="setBackButtonAction()" >
                   segment 2
                </ion-segment-button>
            </ion-segment>
   </ion-toolbar>  
</ion-header>
...

here is my code in my app.component.ts

export class AppComponent {
public segmentSelected: string = 's1';

constructor(
    public platform: Platform,
    public statusBar: StatusBar, 
    public splashScreen: SplashScreen,
  public navCtrl :NavController) {
 this.platformReady();
}


  ionViewDidLoad() {
    this.setBackButtonAction()
}

//Method to override the default back button action
setBackButtonAction(){
  this.navBar.backButtonClick = () => {
  //Write here wherever you wanna do
   this.navCtrl.pop()
  }
}

public platformReady() {
    // Call any initial plugins when ready
    this.platform.ready().then(() => {
      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });
  }

but it doesn’t work. Any help ?

[jaydz]

There are a few things that have to be done to access the navbar. Have you done these?

1. import Navbar

import { Navbar } from 'ionic-angular';

2. import ViewChild

import { ViewChild } from '@angular/core';

3. Add to component, and reference it with a name of your choice

export class AppComponent {
@ViewChild(Navbar) navbarName: Navbar;

4. Now you should be able to get the back-button

setBackButtonAction(){
this.navbarName.backButtonClick = () => {
// Write here what you wanna do
this.navCtrl.pop()
 }
}

So, I just took another look at your code. I don’t see a navbar in your html…