Back button no longer showing

Recently, the nav bar back button has stopped appearing on non-root pages in my app. Regressing my dependencies has not fixed this, nor has moving the <ion-navbar> out of a custom component. After digging in a bit with Chrome DevTools, it seems like PageTransitions is deciding whether or not to add the SHOW_BACK_BTN_CSS class (as here) before the ViewController registers the navbar.

I’ll work on getting repro code going, but in the mean time, has this happened to anyone else? Does anyone know why it might be happening?

Answering my own question in case anyone has this issue in the future:

Each of my pages is getting its data as an observable, which I unwrap with a *ngIf="data$ | async as data" on a wrapper around everything that needs it. On pages, I frequently wanted to add a banner under the navbar, so I would do something like

<ng-container *ngIf="data$ | async as data">
  <ion-header>
    <ion-navbar>Section Title</ion-navbar>
    <ion-toobar class="banner">{{data.title}}</ion-navbar>
  </ion-header>

  <ion-content>
    <!-- stuff using data -->
  </ion-content>
</ng-container>

It seems that the ng-container was interfering with Ionic’s identification of the navbar as a component of the page. Once I realized this, I remembered that ng-container interferes with directives like item-left as well.

1 Like