如何解决按下后退按钮时未调用Angular Router Guard
我有一个Angular应用程序在iframe中运行,该应用程序具有我正在运行的模块的路由防护。每当我使用应用程序内的链接或地址栏导航到页面时,都会激活路由防护,并将应用程序路由到正确的组件。但是由于某些原因,当我从组件中单击“后退”按钮时,模块的路由防护无法启动,并且应用导航到该模块的基本组件-不应发生。
我已经测试并确认,当我使用以下命令之一按下组件内部的后退按钮时,会触发路由器事件:
export class FourthComponent {
constructor(private readonly router: Router) {
this.router.events.subscribe((event: NavigationStart) => {
if (event.navigationTrigger === 'popstate') {
console.log('back or forward button clicked');
}
});
}
每当我从辅助组件屏幕中单击“后退”按钮时,控制台日志便会打印。
这是子模块的路由模块routes
数组:
const routes: Routes = [
{
path: '',canActivate: [SubModuleGuard],children: [
{
path: 'first',component: FirstComponent
},{
path: 'second',component: SecondComponent
},{
path: 'third',component: ThirdComponent
},{
path: 'fourth',component: FourthComponent
},{
path: '**',component: BaseComponent
}
]
}
];
由于某种原因,每次我从FourthComponent
单击后退按钮时,我都导航到BaseComponent(可能是SubModule的所有子组件的情况)。如果我再次单击“后退”按钮,它也会对iframe的父级执行后退操作。
请告诉我为什么路由防护器(在本例中为SubModuleGuard)不会触发,以及如何在单击后退按钮时强制触发路由防护器。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。