I followed official https://material.angular.io/components/dialog/overview where it states that if the dialog component itself has to be closed, we need to inject MdDialogRef reference as below and then close on an event
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();
});
}
}
On successful response from Google OAuth, I see that closeDialog() is called. However, the dialog isn't closed. [I have no issues closing dialog as part of setTimeOut/UserAction]
I found a hack for this to work. It seems that once returned from the callback there are no possible interaction with the dialogRef, however it still can be interacted with from outside. And it will trigger the close if you call
dialogRef.getState()
.