Ion-navbar Back button is invisble after toggling navbar with *ngIf

Ionic Framework ionic-v3
1

I have a <ion-navbar> that can be toggled via a button that sets a property:

<ion-header>
  <ion-navbar *ngIf="showToolbars">
    <ion-title>{{pageTitle}}</ion-title>
  </ion-navbar>
</ion-header>

When the page loads showToolbars is true and everything is fine.
Clicking the button makes the navbar disappear as it should.
But when I then click the button again, the navbar appears with the title being shown, but the “< Back” button is gone!
(The code for the button still seems to be there, but it doesn’t have the correct classes to be visible to the user)

Any ideas?

2

Not sure if it’s appropriate for your use case, but swapping [hidden]="!showToolbars" for the ngIf seems to solve the immediate problem with the back button.

2 Likes
3

D’oh, of course.

I even see no difference in how the nav-bar is hidden really.