Ionic 2 – Disabling back button for a specific view

Question

Option 1

Hide it in the view by adding the hideBackButton attribute to the ion-navbar component

<ion-navbar hideBackButton="true">
    <ion-title>Sub Page</ion-title>
</ion-navbar>

Option 2

Hide it from within the page class by using the .showBackButton(bool) method provided by the ViewController class

import { NavController, ViewController } from 'ionic-angular';

export class SubPage {

    constructor(public navCtrl: NavController, private viewCtrl: ViewController) { }

    ionViewWillEnter() {
        this.viewCtrl.showBackButton(false);
    }

}

A comment from the Ionic docs

Be sure to call this after ionViewWillEnter to make sure the DOM
has been rendered.

Note

I’d just like to add that these options don’t take into account when the hardware back button is pressed. The hardware back button is still likely to cause the active page to pop from the nav stack.

Leave a Comment Cancel reply