Ionic 3 split-pane - menuToggle not working

Ionic Framework ionic-v3
1

Hello,

I am trying to adapt an app from mobile-only view to support also tablets, with split-pane, but the menuToggle button, that should show the overlay menu, is set as hidden. Even if I add css to force it to appear, tapping it does nothing. Without the split-pane, it works as expected. Here’s a short version of the code:

app.component.html

<ion-menu type="overlay" [content]="rootNav" [swipeEnabled]="false">
  <bm-burger-menu></bm-burger-menu>
</ion-menu>
<ion-nav #rootNav [root]="rootPage" swipeBackEnabled="false"></ion-nav>

dashboard.component.html

<ion-content>
  <ion-split-pane [when]="isTabletLandscape()">
    <div class="columns">
      <section class="column favourites" main>
        <div *ngIf="isTabletLandscape()">
          <ng-content *ngTemplateOutlet="navbar"></ng-content>
        </div>
      </section>
      <section class="column">
        <ion-nav #detailsPane swipeBackEnabled="false"></ion-nav>
      </section>
    </div>
  </ion-split-pane>
</ion-content>

<ng-template #navbar>
  <ion-navbar class="navBar">
    <button class="buttonContainer" ion-button menuToggle>
      <img ion-img src="./assets/images/dashboard/burger.svg">
    </button>
    <ion-buttons end>
      <!-- other buttons -->
    </ion-buttons>
  </ion-navbar>
</ng-template>

Browser output snippet:

<button class="buttonContainer disable-hover bar-buttons bar-buttons-ios bar-button bar-button-ios bar-button-default bar-button-default-ios bar-button-menutoggle bar-button-menutoggle-ios" ion-button menutoggle **hidden** >
  <span class="button-inner">
    <img ion-img="" src="./assets/images/dashboard/burger.svg">
  </span>
  <div class="button-effect"></div>
</button>