1

공식 https://material.angular.io/components/dialog/overview을 따랐을 때 대화 상자 구성 요소 자체를 닫아야하는 경우 아래와 같이 MdDialogRef 참조를 삽입 한 다음 이벤트를 닫아야한다고 나와 있습니다MdDialogRef.close가 콜백에서 호출 할 때 대화 상자를 닫지 않습니다. fn

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의 일부로 대화 상자를 닫는 데 문제가 없습니다]

답변

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을 정의하십시오.

또한 실패하면 대화 상자에 애니메이션이 없음을 볼 수 있습니다.

많은 코드를 게시하지 않았으므로 확실하지 않습니다.

+0

광산은 다른 것으로, '콜백 이벤트에서'대화 상자를 닫으려고합니다. 앞서 언급했듯이 사용자 입력 작업을 열거 나 닫는 데 문제가 없습니다. – nsk