Ion-menu does not appear

I’ve created an side-menu as a component which looks like this:

import { Component, OnInit } from '@angular/core';
import { MenuController } from '@ionic/angular';

@Component({
  selector: 'app-side-menu',
  templateUrl: './side-menu.component.html',
  styleUrls: ['./side-menu.component.scss'],
})
export class SideMenuComponent implements OnInit {

  constructor(private menu: MenuController) { }

  ngOnInit() {
    this.menu.enable(true, 'first');
  }

  openFirst() {
    this.menu.open('first');
  }

}

My side-menu.component.html looks like:

<ion-menu side="start" menuId="first">
  <ion-header>
    <ion-toolbar color="primary">
      <ion-title>Start Menu</ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-list>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
      <ion-item>Menu Item</ion-item>
    </ion-list>
  </ion-content>
</ion-menu>

<ion-router-outlet main></ion-router-outlet>

On any page, I try to use it like this:
this.sideMenu.openFirst();
Header on the html of the page looks like:

<ion-buttons slot="start">
			<ion-menu-button autoHide="false" (click)='openMenu()'></ion-menu-button>
		</ion-buttons>
		<ion-title>
			{{pageTitle}}
		</ion-title>

The icon with three bars appears, but nothing happens at all, when clicking.
The open-event is fired