如果我尝试在未保存的更改后进行重定向,则一切正常。现在,如果我重定向然后击中后部按钮,则canDeactive实例将触发,甚至会说我的模态至少是通过编程打开的。但什么也不会发生,而且我不能再更改路线了。
这是我的CanDeactivate routeGuard
export interface CanComponentDeactivate {
canDeactivate(): Observable<boolean> | Promise<boolean> | boolean;
}
@Injectable()
export class CanDeactivateGuard implements CanDeactivate<CanComponentDeactivate> {
canDeactivate(component: CanComponentDeactivate): Observable<boolean> | Promise<boolean> | boolean {
return component.canDeactivate();
}
}
这是我的模态服务
export interface IBaseModal {
modalId: string;
navigateAwaySelection: Subject<boolean>;
isOpen: boolean;
}
@Injectable()
export class ModalService {
private modals: Map<string, IBaseModal>;
constructor() {
this.modals = new Map<string, IBaseModal>();
}
close(modalId: string): void {
if (this.modals.has(modalId)) {
const modal = this.modals.get(modalId);
modal.isOpen = false;
}
}
open(modalId: string): boolean | Observable<boolean> {
if (this.modals.has(modalId)) {
const modal = this.modals.get(modalId);
modal.isOpen = true;
return modal.navigateAwaySelection;
}
}
registerModal(modalId: string, newModal: IBaseModal): IBaseModal {
if (this.modals.has(modalId)) {
return this.modals.get(modalId);
}
this.modals.set(modalId, newModal);
return this.modals.get(modalId);
}
}
这是我的模态
export class OnRedirectSaveModalComponent implements OnInit, IBaseModal {
modalId = 'redirectModal';
navigateAwaySelection: Subject<boolean> = new Subject<boolean>();
isOpen = false;
constructor(private modalService: ModalService) { }
ngOnInit() {
this.modalService.registerModal(this.modalId, this);
}
onCancelClick() {
this.navigateAwaySelection.next(false);
this.modalService.close('redirectModal');
}
onOkClick() {
this.navigateAwaySelection.next(true);
this.modalService.close('redirectModal');
}
}
在这里被称为
canDeactivate(): Observable<boolean> | boolean {
if (this.dataLoaded && this.isChanged) {
return this.modalService.open('redirectModal');
} else {
return true;
}
}