我有一个函数打开一个MatDialog与一个名为'NoteFormComponent'的组件,它看起来像这样
openForm() {
let dialogConfig = new MatDialogConfig();
dialogConfig.autoFocus = true;
dialogConfig.width = "95%";
dialogConfig.panelClass = "form-dialog";
dialogConfig.scrollStrategy = new NoopScrollStrategy();
this.dialog.open(NoteFormComponent, dialogConfig).beforeClose().subscribe(() => this.getNotes());
}
我弹出一个包含'NoteFormComponent'的模态。那么问题是什么?
问题是我想在没有MatDialog的情况下使用'NoteFormComponent',但是为了将它与MatDialog一起使用,我必须在组件的构造函数中注入一个像这样的引用
constructor(
private noteService : NoteService,
private productService : ProductService,
private categoryService : CategoryService,
private clientService : ClientService,
private notification : NotificationService,
private dialogRef : MatDialogRef<NoteFormComponent>, /*This Reference*/
private loader : LoaderService,
private sessionService : SessionService,
private securityBlockerService : SecurityBlockerService,
private dialog : MatDialog,
private dialogService : DialogService
) { }
如果我尝试使用带有模板选择器的组件''它会抛出一个错误,即MatDialogRef没有提供者,我唯一想到的就是创建'NoteFormComponent'的副本但是没有MatDialogRef注入器构造函数。
无论如何要解决或解决这个问题?
在构造函数(@Optional()
)中注入MatDialogRef时使用Reference装饰器:
constructor(
...
@Optional() private dialogRef: MatDialogRef<NoteFormComponent>,
...
) { ... }
通过这样做,您可以以正常方式使用NoteFormComponent
,而无需使用MatDialog。