Question

我正在实现一个带有材料对话的路由保护器，该对话需要在延迟加载其他模块之前进行身份验证。首次调用警卫时，其行为符合预期：如果我进行身份验证，则可以继续。第二次执行防护后，实际上会调用它两次，因此对话框将显示两次，并且在对话框仍然有效的情况下，这是不可接受的。我更改了在对话框中使用的组件，但没有成功。只有当我从警卫队中删除整个对话框时，警卫队才会在每个导航触发器上被调用一次

我在模块中的路线如下：

const myRoutes: Routes = [
  {
    path: '',
    component: AlphaComponent,
    canActivate: [myFirstGuard]
  },
  {
    path: 'second-path',
    canActivate: [mySecondGuard],
    data: {privilegeToCheck: MyPrivilegeEnum.ThePrivilege},
    loadChildren: () => import('./second/second.module').then(mod => mod.SecondModule)
  }
];

@NgModule({
  imports: [
    RouterModule.forChild(myRoutes)
  ],
  exports: [
    RouterModule
  ],
  providers: [
    mySecondGuard
  ]
})
export class AlphaComponentRoutingModule {
}

我正在传递警卫将用于身份验证的一些数据。这是我的警卫：

@Injectable()
export class mySecondGuard implements CanActivate {

  constructor(private dialogService: DialogService) { }

  // @ts-ignore
  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {

    const currentPrivilege = next.data.privilegeToCheck as MyPrivilegeEnum;
    const dialogRef = this.dialogService.showComponentDialog(
      IdentificationComponent,
      {currentPrivilege},
      true);
    return dialogRef.componentInstance.resultOfTheDialog;
  }
}

这是我使用的showComponentDialog函数：showComponentDialog(dialogComponent: any, dialogData?: any, disableClose: boolean = false, position?: any): MatDialogRef<any>

根据身份验证，IdentificationComponent将发出对/错结果。警卫正确理解了结果并进行相应的处理。

我的应用程序中的其他防护措施都工作正常，而只有这种方式才具有这种奇怪的行为。如果我从防护中删除对话框并任意返回true/false，则防护不会被调用两次，所以这不是一个导航问题（我没有多次导航到该路线，因此触发了“两次”防护）。因此带有对话框的后卫实际上是有效的，但是在第一个调用之后，我将显示两个对话框。

我看到的正是这个Angular CanActivate With Login Dialog。如果接下来几天无法解决问题，我将在stackblitz或存储库中提供一个工作示例

CanActivated中的“材质”对话框使防护被调用两次

0 个答案: