打开对话框未正确打开材料角度 11答案

【问题标题】：open dialog not open correctly material angular 11打开对话框未正确打开材料角度 11
【发布时间】：2020-12-22 20:28:19
【问题描述】：

我在打开对话材料时遇到问题。我的对话框没有正确打开

首先我在AppModule 中导入MatDialogModule
第二次我在构造函数中声明MatDialog
第三我在构造函数中声明MatDialogRef

HTML 文件 (booklist.component.html)

<button mat-raised-button (click)="onCreate()"><mat-icon>add</mat-icon>Create</button>

Ts 文件 (booklist.component.ts)

constructor(private bookService: BookService, public dialog: MatDialog) { }
onCreate() {
    this.bookService.initializeFormGroup();
    const dialogConfig = new MatDialogConfig();
    dialogConfig.disableClose = true;
    dialogConfig.autoFocus = true;
    dialogConfig.width = "350px";
    this.dialog.open(BookComponent,dialogConfig);
  }

Ts 文件 (book.component.ts)

constructor(public service: BookService,public dialogRef: MatDialogRef<BookComponent>,@Inject(MAT_DIALOG_DATA) public data: any) { }

在我的应用程序中，当我单击创建按钮后单击书页时，我的对话框无法正确打开，请问有什么想法吗？

这是我在 stackblitz 中的项目的链接：https://stackblitz.com/github/lnquaidorsay/bibliofront 或确切链接：https://parigwxyr.github.stackblitz.io/books

【问题讨论】：

标签： angular angular-material dialog modal-dialog

【解决方案1】：

添加到您的 AppModule entryComponents: [BookComponent],

例如：

  entryComponents: [BookComponent],
  providers: [],
  bootstrap: [AppComponent]

如果您在 Angular 项目中使用 Ivy，则无需添加 entryComponents 但您的项目似乎不支持 Ivy idk 为什么...

进入设置 -> 启用 Ivy。应该可以解决这个问题

【讨论】：