Well, this works for me very good.
First, I have the menu on app.component.html
<ion-app>
<ion-menu side="start">
<ion-header>
<ion-toolbar>
<ion-title>
Title
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-menu-toggle>
<ion-item lines="none" routerLink="/somePath">
<ion-icon name="business" slot="start"></ion-icon>
<ion-label>item 1</ion-label>
</ion-item>
</ion-menu-toggle>
<ion-menu-toggle>
<ion-item lines="none" routerLink="/somePath">
<ion-icon name="checkbox-outline" slot="start"></ion-icon>
<ion-label>item 2</ion-label>
</ion-item>
</ion-menu-toggle>
<ion-menu-toggle>
<ion-item lines="none" (click)="someAction()" button>
<ion-icon name="exit" slot="start"></ion-icon>
<ion-label>item 3</ion-label>
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
// and then you set your normal ion-router-outlet
<ion-router-outlet main></ion-router-outlet>
</ion-app>
Whenever you want to add the menu button on another .html file, then you just
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button> <!-- see how there are no complicated things here -->
</ion-buttons>
<ion-title>Title</ion-title>
</ion-toolbar>
</ion-header>