Dialog geht nicht zu

src/app/app.module.ts

@@ -31,6 +31,7 @@ import { RoundHistoryComponent } from './round-history/round-history.component';
 import {MatTableModule} from '@angular/material/table';
 import {MatTreeModule} from '@angular/material/tree';
 import {ViewModus} from './dao/viewModus';
+import {MatDialogModule} from '@angular/material/dialog';
 
 @NgModule({
   declarations: [
@@ -64,6 +65,7 @@ import {ViewModus} from './dao/viewModus';
     MatTooltipModule,
     MatTableModule,
     MatTreeModule,
+    MatDialogModule
   ],
   providers: [
     IsAllowedToPlay,

src/app/overview/overview.component.html

@@ -69,6 +69,7 @@
       <mat-card-title *ngIf="!isActiveRound">{{nextTeam}} ist am Zug:</mat-card-title>
       <br>
       <button [disabled]="buttonNextRoundDisabled || gameStatus.activeExplainer == 1" mat-raised-button color="primary" (click)="nextRound()">Ich erkläre und los!</button>
+      <button mat-button (click)="openDialog()">Launch dialog</button>
     </mat-card-actions>
   </mat-card>
 </div>

src/app/overview/overview.component.ts

@@ -8,6 +8,7 @@ import {Subject} from 'rxjs';
 import {takeUntil} from 'rxjs/operators';
 import {ViewModus} from '../dao/viewModus';
 import {Location} from '@angular/common';
+import {MatDialog} from '@angular/material/dialog';
 
 @Component({
   selector: 'app-overview',
@@ -54,7 +55,8 @@ export class OverviewComponent implements OnInit, OnDestroy {
               private service: TabuMiddlewareService,
               private isAllowedToPlay: IsAllowedToPlay,
               private socketDataService: SocketDataService,
-              private screen: ViewModus) {
+              private screen: ViewModus,
+              public dialog: MatDialog) {
     screen.$view.subscribe(
       view => {
         this.view = view;
@@ -252,6 +254,10 @@ export class OverviewComponent implements OnInit, OnDestroy {
     }
   }
 
+  openDialog() {
+    this.dialog.open(TestDialogComponent);
+  }
+
   @HostListener('window:scroll', ['$event'])
   onWindowScroll($event: any): void {
     const numb = window.scrollY;
@@ -274,3 +280,8 @@ export class OverviewComponent implements OnInit, OnDestroy {
     this.ngUnsubscribe.complete();
   }
 }
+@Component({
+  selector: 'testdialog',
+  templateUrl: './testdialog.html',
+})
+export class TestDialogComponent {}
\ No newline at end of file

src/app/overview/testdialog.html

+<h1 mat-dialog-title>Ihr habt alle Begriffe durchgespielt!</h1>
+<div mat-dialog-content>Eröffnet einen neuen Raum oder setzt den Fortschritt sofort hier zurück:</div>
+<div mat-dialog-actions>
+  <button mat-button mat-dialog-close>Zurücksetzen</button>
+  <button mat-button >Schließen</button>
+</div>