mat-dialog-close返回未定义

问题描述

我有一个按钮，根据条件它可以打开两个不同的对话框。当我使用伪指令mat-dialog-close='false'从其中一个关闭false值时，会成功返回，而从另一个伪指令中，则返回undefined。

我尝试在组件中使用dialogRef，但是尽管我已经在组件和模块中导入了类，但仍然收到错误No provider for matdialogRef。

我尝试在setTimeOut中使用dialogRef.afterOpened()从父级关闭对话框，但是行为是相同的。对于一种方法，它运行良好，但对于另一种方法，它返回undefined。

我发现，如果我为每个组件返回console.log dialogRef，则差异在_result字段中。只需打开它们，结果字段就已经完成，并且数据是通过mat-dialog-close指令传递的。对于一个来说，工作正常_result的值为false，对于另一个来说，它的值为undefined。

我找不到为什么它不能按预期工作。

未定义返回值的组件的对话框引用

   MatDialogRef {_overlayRef: OverlayRef,_containerInstance: MatDialogContainer,id: "mat-dialog-0",disableClose: true,_afterOpened: Subject,…}
    componentInstance: null
    disableClose: true
    id: "mat-dialog-0"
    _afterClosed: Subject {_isScalar: false,observers: Array(0),closed: false,isStopped: true,hasError: false,…}
    _afterOpened: Subject {_isScalar: false,…}
    _beforeClosed: Subject {_isScalar: false,…}
    _closeFallbackTimeout: 97
    _containerInstance: MatDialogContainer {_isDisposed: false,_elementRef: ElementRef,_focusTrapFactory: FocusTrapFactory,_changeDetectorRef: ViewRef,attachDomPortal: ƒ,…}
    _overlayRef: OverlayRef {_portalOutlet: DomPortalOutlet,_host: null,_pane: null,_config: {…},_ngZone: NgZone,…}
    _result: undefined
    _state: 2
    __proto__: Object

返回值的组件的对话框引用

MatDialogRef {_overlayRef: OverlayRef,id: "mat-dialog-1",…}
componentInstance: null
disableClose: true
id: "mat-dialog-1"
_afterClosed: Subject {_isScalar: false,…}
_afterOpened: Subject {_isScalar: false,…}
_beforeClosed: Subject {_isScalar: false,…}
_closeFallbackTimeout: 140
_containerInstance: MatDialogContainer {_isDisposed: false,…}
_overlayRef: OverlayRef {_portalOutlet: DomPortalOutlet,…}
_result: false
_state: 2
__proto__: Object

打开对话代码（FROM父组件）。

openTablaOpcionesDialog(){
  this.isLoading= true;
  let tablaComponente: ComponentType< TablaDrogasComponent | TablaSolucionesComponent >;
  let service:  DrogasService | SolucionesService 
  if(this.form.controls.tipo.value == tipoSolucion.madre){
    service= this.ds;
    tablaComponente = TablaDrogasComponent
  } else {
    service= this.ss;
    tablaComponente= TablaSolucionesComponent
  }
  service.modeForm = estadoFormulario.seleccionRegistro;
  this.ss.modeForm = estadoFormulario.seleccionRegistro
  const dialogRef = this.dialog.open(tablaComponente,{
    width: '1400px',height: '750px',});

  dialogRef.afterOpened().subscribe(
    ()=> {
      this.isLoading= false;
      setTimeout(()=>{dialogRef.close(false)},3000)
      console.log(dialogRef)
    },err=> {
      this.isLoading= false;
      console.log(err);
    }
  );
  dialogRef.afterClosed().subscribe( res => {
    console.log(res)
    service.modeForm = estadoFormulario.registroNuevo;
    if(res != false){
      this.codigoOrigen.setValue(res)
    } 
  });
}

更新

我意识到在对话框打开时调用的Componente并返回预期值，该Componente在与调用它的Component相同的模块中声明。另一个在其他模块中声明。我该如何运作？

总结：我需要打开一个对话框，其中包含在其他模块中声明的组件，而当对话框关闭时，我需要访问dialogRef.afterClose中的返回数据。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）