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

Question

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

1. 首先我在 MatDialogModule 中导入 AppModule
2. 第二个我在构造函数中声明MatDialog
3. 第三个我在构造函数中声明 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

Answer 1

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

例如：

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

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

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