#angular #angular8 #router
#angular #angular8 #маршрутизатор
Вопрос:
Навигация в приложении не может быть остановлена без использования Guard???
Ниже приведен мой пример кода
constructor(
private XXXXXService: XXXXXService
) {
this.XXXX.XX_amount = 0;
this.routerSubscription = this.router.events.subscribe((event: Event) => {
if (event instanceof NavigationStart) {
//do something on start activity
console.log("event instanceof NavigationStart",this.router.events, event)
if(this.invoiceForm.dirty){
if(window.confirm("WARNING: You have unsaved changes. Press Cancel to go back and save these changes, or OK to lose these changes."))
{
const currentRoute = this.router.routerState;
console.log("pressed CANCEL NOT OK", this.router.routerState,currentRoute.snapshot.url);
this.router.navigateByUrl(currentRoute.snapshot.url, { skipLocationChange: false });
}
else
{
const currentRoute = this.router.routerState;
// This is some CODE Im Trying,please ignore this
//event.preventDefault()
console.log("pressed CANCEL NOT OK", this.router.routerState,currentRoute.snapshot.url);
this.router.navigateByUrl(currentRoute.snapshot.url, { skipLocationChange: true });
}
}
if (event instanceof NavigationError) {
// Handle error
console.error(event.error);
}
if (event instanceof NavigationEnd) {
//do something on end activity
console.log("event instanceof NavigationEnd")
}
}
});
}
@HostListener('window:beforeunload', ['$event'])
unloadNotification($event: any) {
if (this.hasUnsavedData()) {
$event.returnValue =true;
}
}
hasUnsavedData()
{
return !this.XXXXForm.dirty
}
ngOnInit() {
console.log(this.location.getState());
Независимо от результата подтверждения Windowown, страница по-прежнему переходит на другую страницу. Навигация в приложении не может быть остановлена.
Комментарии:
1. Покажите окружающий код. Кажется, вы запускаете подтверждение, когда навигация уже запущена..
2. @MikeOne Окружающий код, я использовал приведенный ниже код внутри моего конструктора и ** Этот код для предотвращения закрытия и обновления проблемы. ** Чтобы предотвратить закрытие вкладки / браузера и перезагрузку, подтвердите @HostListener(‘window:beforeunload’, [‘$event’]) unloadNotification($event: any) { if (this.hasUnsavedData()) { $event.returnValue =true; } } hasUnsavedData() { return !this.SomeFORM.dirty } и мой исходный код, который я отредактировал в том же вопросе.
3. @MikeOne Да, я запускаю подтверждение только во время навигации, потому что мое требование заключается только в том, чтобы при переходе проверить, не загрязнена ли форма, и, если разрешить переход, заполнить форму, а затем перейти
Ответ №1:
Выполните действие, которое изменяет маршрут, при условии проверки формы. Я использую это в событии нажатия кнопки, которое переводит посетителя на другую страницу.
Пытаюсь сделать что-то вроде этого.
onBack(): void {
if (this.checkForm()) {
// navigate elsewhere
}
}
checkForm(): boolean {
if (this.customerForm.touched) {
return confirm(`Navigate away and lose all your changes?`);
}
return true;
}
Комментарии:
1. Огромное спасибо за быстрый ответ, но действие по изменению маршрута уже подвергается событию router.event.subscribe() и независимо от подтверждения ответа msg перенаправляет на новую страницу.
2. О, я понимаю. Это было неясно из вашего первоначального описания. Возможно, вы могли бы объяснить, чего вы пытаетесь достичь? Вы не можете использовать защиту маршрута? Я что-то упустил?