如何正确配置 MatDialog？

Question

当用户输入错误的用户名和密码组合时，尝试在我的 Angular 页面中显示 MatDialog，而不是显示我的登录页面本身。 见下图： Dialog

这是我对 LoginComponent 感到厌烦的地方：

     login() : void {
              const dialogConfig = new MatDialogConfig();
  this.utilisateurService.getLogin(this.username,this.password).subscribe((util: UtilisateurModel) => {
              this.utilisateur = util;
              if(util)
              {
                this.router.navigate(["home"]);
              }
              else
              {
                dialogConfig.disableClose = true;
                dialogConfig.autoFocus = true;
                dialogConfig.data = {
                  id: 1,
                  title: 'Désolé, nom d\'utilisateur ou mot de passe non reconnu.'
              };
          this.dialog.open(LoginComponent, dialogConfig);
              }
            });

          }

我通过在app.module.ts 的@NgModule 中添加entryComponents 尝试了this answer，但没有任何变化：

     providers: [],
  bootstrap: [AppComponent],
  entryComponents: [
    LoginComponent
  ]

提前谢谢你

Answer 1

在这一行：

this.dialog.open(LoginComponent, dialogConfig);

您应该传递您的另一个组件，该组件表明凭据有问题，而不是 LoginComponent。因此，您需要专门定义新组件以显示该错误消息，将其传递给open()，并且不要忘记将其注册到entryComponents。 希望对您有所帮助。