当从回调fn调用时,MdDialogRef.close不会关闭对话框

时间:2017-09-11 20:40:46

标签: angular firebase-authentication material-design mddialog

我遵循官方https://material.angular.io/components/dialog/overview,其中声明如果必须关闭对话框组件本身,我们需要按如下方式注入MdDialogRef参考,然后关闭事件

export class LoginDialogComponent {
  constructor(public dialogRef: MdDialogRef<LoginDialogComponent>,
      @Inject(MD_DIALOG_DATA) public data: any, public afAuth: AngularFireAuth, private router: Router) {
  }

  closeDialog(): void {
    this.dialogRef.close();
  }

  signInWithGoogle() {
    const self = this;
    this.afAuth.auth
        .signInWithPopup(new firebase.auth.GoogleAuthProvider())
        .then(res => {
          self.closeDialog();
        });
  }
}

Google OAuth成功回复后,我看到调用了closeDialog()。但是,对话框尚未关闭。 [作为setTimeOut / UserAction的一部分关闭对话框没有问题]

1 个答案:

答案 0 :(得分:0)

不确定它是否相关但有相同的问题我跟踪到我在对话框中有一个表单的事实我在我的输入中使用ngModel进行双重绑定但是我绑定的对象未定义。

下面,如果该输入位于对话框中,如果data.media.i18n.en.title未定义,则控制台中不会出现异常,并且mdDialog不会关闭。

<input id="title" name="title" [(ngModel)]="data.media.i18n.en.title">

因此,在打开对话框之前,我必须正确初始化该对象:

// before opening the dialog, initialize the variable
if (typeof media.i18n === 'undefined') {
  media.i18n = {
    fr: {
      title: ''
    }
  };
}

let dialogRef = this.dialog.open(EditMediaDialogComponent, {
  data: {
    media: media
  }
});

您可以在此处测试:https://plnkr.co/edit/95atm4PIeKvyorVkcD0f?p=preview

那个plnkr失败了。如果要更正它,请在打开对话框之前定义animal.name。

此外,当它失败时,您可以看到对话框中没有动画。

由于您没有发布太多代码,因此不确定您的情况。