Remove back button Ionic2

1
votes

I am trying to remove the back button from navigation bar of my pages. Is there any way to do so

enter image description here

Thanks

6
ionic2

6 Answers

5
votes

This is the simplest way to remove back button in Ionic

<ion-navbar hideBackButton *navbar>< /ion-navbar>
4
votes
 <ion-navbar hideBackButton="true">

include this in your ion-navbar .. the back button will be excluded for your current view

3
votes

To remove the back button on this.navCtrl.push in your app.module.ts file

do this

import { IonicApp, IonicModule } from 'ionic-angular';

@NgModule({
  declarations: [ MyApp ],
  imports: [
    IonicModule.forRoot(MyApp, {
      backButtonText:'',
      backButtonIcon:''
    }, {}
  )],
  bootstrap: [IonicApp],
  entryComponents: [ MyApp ],
  providers: []
})

take a look at this link http://ionicframework.com/docs/v2/api/config/Config/

another way is you should use this.navCtrl.setRoot(pagename,{});

2
votes

One way is to use ion-toolbar

<ion-toolbar>
    <ion-title>Header</ion-title>
  </ion-toolbar>

instead of navbar. Note: User will still be able to go back through the phone back button.

2
votes

Use the ion-toolbar instead of ion-navbar.

<ion-header>
  <ion-toolbar>
    <ion-buttons left>
      <button ion-button left menuToggle="MyMenu">
        <ion-icon name="menu"></ion-icon>
      </button>
    </ion-buttons>
    <ion-title>My Awosome App</ion-title>
  </ion-toolbar>
</ion-header>
0
votes

Better go for $ionicNavBarDelegate This will helps to configure your backbutton. http://ionicframework.com/docs/api/service/$ionicNavBarDelegate/