Ionic Change back button icon for one page only

问题:

Using app.module.ts, setting IonicModule.forRoot(MyApp,{backButtonIcon:"close"}) will set all the back icons in my app to close icon. However, I want to apply this in only a page or two of the app, and keep the rest with the default, or maybe third icon I choose. Does anyone know how can that be done without implementing my own button and functions for the back functionality?

回答1:

By having an ion-toolbar in the ion-header, it appears on top of the default ion-navbar. So it is a workaround to have a custom header bar with my close icon and my custom function gotoHome(). That's the best way i found to customize the 'navbar' for a particular page.

<ion-header>

    <ion-toolbar>
        <ion-buttons left>
            <button ion-button icon-only (click)="gotoHome()">
                <ion-icon name="close"></ion-icon>
            </button>
        </ion-buttons>
        <ion-title>Title</ion-title>
    </ion-toolbar>

</ion-header>

<ion-content padding>
    ...
</ion-content>