Может деактивировать охрану работает только один раз в Angular - PullRequest
0 голосов
/ 29 июня 2018

Да, я знаю, что это duplicate issue, но предыдущий пост не решает это. Защитный код:

  canDeactivate(component: ExamEndedComponent,
                currentRoute: ActivatedRouteSnapshot, currentState: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return this.store.select(fromRoot.getExamStatus)
      .pipe(
        take(1),
        map((res: string) => {
          console.log(res);
          if (res === 'started') {
            alert('stop');
           console.log(currentState.url);
            return false;
          }
          return true;
        })
      );
  }

, но проблема в том, что при нажатии на back button в браузере защита запускается только один раз, поэтому, когда пользователь clicking again действительно может уйти. Также проверил вопрос в угловых : https://github.com/angular/angular/issues/12851 но он пытается решить проблему, снова перейдя к текущему маршруту, прежде чем вернуть false, как показано ниже:

 canDeactivate(component: ExamEndedComponent,
                currentRoute: ActivatedRouteSnapshot, currentState: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return this.store.select(fromRoot.getExamStatus)
      .pipe(
        take(1),
        map((res: string) => {
          console.log(res);
          if (res === 'started') {
            alert('Deactivation blocked');
           console.log(currentState.url);
            this.router.navigate([currentState.url]);
            return false;
          }
          return true;
        })
      );
  }

В этот момент оповещение вызывается дважды, потому что перед возвратом false я перехожу к currentState, чтобы угловые прогоны можно было снова деактивировать, но после повторного нажатия на кнопку «назад» canDeactivate не вызывается. Таблица маршрутизации:

const appRoutes: Routes = [
  { path: 'Authentication', component: AuthComponent},
  {path: '', redirectTo: 'home', pathMatch: 'full'},
  { path: 'home', component: HomeComponent, children: [
      {path: '', redirectTo: 'exam', pathMatch: 'full'},
      {path: 'exam', component: ExamComponent, children: [
          {path: '', redirectTo: 'start', pathMatch: 'full'},
          {path: 'start', component: ExamStartComponent},
          {path: 'started', component: ExamQuestionsComponent,
            canActivate: [ExamQuestionsGuard],
            canDeactivate: [ExamStartedDeactivateGuard]},
          {path: 'ended', component: ExamEndedComponent, canDeactivate: [ExamStartedDeactivateGuard]}
        ], resolve: {exam:  ExamResolver}}
    ],
    canActivate: [AuthGuard], resolve: {sign: SignInResolver}}
];

В чем проблема? Заранее спасибо.

...