Angular7: Global Guard - CanDeactivate интерфейс - PullRequest
Новая
       19

Angular7: Global Guard - CanDeactivate интерфейс

0 голосов
/ 18 июня 2019

Я очень плохо знаком с Angular, и мне не удалось найти ответ на то, что я ищу.

Проблема, с которой я сталкиваюсь сейчас, заключается в том, что все глобальные сообщения об ошибках не исчезают при переключениина другой маршрут.

Я попытался решить эту проблему с помощью интерфейса CanDeactivate.Это мой метод canDeactivate: 

  canDeactivate(): Observable<boolean> {
    console.log('delete test');
    this.globalMessageService.remove(GlobalMessageType.MSG_TYPE_ERROR);
    return of(true);
  }

Этот метод создается в службе с именем cms-page.guard.ts, и при использовании этого на определенных страницах он, кажется, работает просто отлично.Пример, если я использую это на странице "Курсы": 

const routes: Routes = [
  {
    path: 'courses',
    canActivate: [CmsPageGuards],
    canDeactivate: [CmsPageGuards],
    data: { pageLabel: 'courses' },
    component: CoursesPageComponent
  }
];

По сути, я применил метод canDeactivate на определенной странице.Мне было интересно, возможно ли создать Guard, который применяет глобально метод canDeactivate, чтобы он работал для всех страниц при переходе на другой маршрут?

1 Ответ

2 голосов
/ 18 июня 2019

Я думаю, что ваша цель - справиться с глобальными ошибками.Вам не нужно использовать canDeactivateGuard для того же.Вы можете добиться этого с помощью интерфейса ErrorHandler.

import { ErrorHandler, Injectable} from '@angular/core';
@Injectable()
export class GlobalErrorHandler implements ErrorHandler {
constructor() { }
      handleError(error) {  //override handleError method
     //handle all errors here 
         console.log('error')
         // IMPORTANT: Rethrow the error otherwise it gets swallowed
         throw error;
      } 
}

Теперь нам просто нужно указать angular использовать GlobalErrorHandler вместо его значения по умолчанию 

@NgModule({


 declarations: [AppComponent],
  imports: [BrowserModule],
  bootstrap: [AppComponent],
  providers: [
    {
      provide: ErrorHandler, 
      useClass: GlobalErrorHandler
    }
  ]
})
export class AppModule { }

И для всех компонентов, имеющих объявление в app.module.ts, будет использоваться GlobalErrorHandler.Надеюсь, это поможет вам!

...