Положение меню сдвигается после dialog.close / afterclosed ()

Question

Итак, у меня есть кнопка Меню, и к каждой кнопке подключено диалоговое окно.
Поэтому, если я нажму кнопку удаления, откроется диалоговое окно с «Вы уверены, что хотите удалить ее»

Но когда я нажимаю кнопку подтверждения и снова нажимаю на кнопку меню, меню перемещается в другое место.

До открытия и закрытия диалогового окна:

После открытия и закрытия диалога:

HTML

<button mat-stroked-button color="primary" [matMenuTriggerFor]="Menu"> Options </button>
    <mat-menu  #Menu="matMenu">
      <button class="menu-item" mat-menu-item >Change</button>
      <button class="menu-item" mat-menu-item (click)="openRemoveEventDialog(event)">Remove</button>
      <button class="menu-item" mat-menu-item >Notify users</button>
      <button class="menu-item" mat-menu-item>Summary</button>
    </mat-menu>

TS DIALOG

 openRemoveEventDialog() {
    const dialogReference = this.dialog.open(RemoveEventDialogComponent);
    dialogReference.afterClosed().subscribe(result => {
    //do stuff here after button is clicked
   }
    });
  }