[英]dialogRef.close() is not a function opening from one component and closing from another component
我有下面的 MatDialog
export class ImportProcessingDialog extends AppComponentBase {
constructor(public dialogRef: MatDialogRef<ImportProcessingDialog>) {
super(injector);
}
onCloseClick(): void{
this.dialogRef.close();
}
}
现在我从一个组件打开MatDialog
,如下所示
export class ImportDataComponent implements OnInit {
constructor(private importProcesingDialog: MatDialog) {}
private onClickImport() {
this.importProcesingDialog.open(ImportProcessingDialog, {
width: '30%'
});
}
}
现在我想从另一个组件关闭对话框
export class RisksComponent {
constructor(public dialogRef: MatDialogRef<ImportProcessingDialog>) {
}
oncloseClick(){
this.dialogRef.close();
}
}
当我这样做时,出现异常
NullInjectorError: R3InjectorError(MainModule)[MatDialogRef -> MatDialogRef -> MatDialogRef -> MatDialogRef]:
NullInjectorError: No provider for MatDialogRef!
所以添加了提供者如下
providers: [{
provide: MatDialogRef,
useValue: {}
},]
使用提供程序代码修复了错误,但是在我单击oncloseClick
function 时出现以下错误
TypeError: this.dialogRef.close is not a function
如何将对话框 ref 存储在服务中,可以从任何组件访问它!
export class ImportProcessingDialog extends AppComponentBase {
constructor(public dialogRef: MatDialogRef<ImportProcessingDialog>,
private testService: TestService) {
this.testService.dialogRef = dialogRef;
super(injector);
}
onCloseClick(): void{
this.dialogRef.close();
}
}
然后在风险部分你可以做
export class RisksComponent {
constructor(public dialogRef: MatDialogRef<ImportProcessingDialog>,
private testService: TestService) {
}
oncloseClick(){
if(this.testService.dialogRef) {
this.testService.dialogRef.close();
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.