[英]angular navigation and validation - routes with params
在我的项目中,我有一些接受参数的路由。
我的几条路线(兄弟姐妹):
{
path: '', component: HomeComponent,
},
{
path: 'factories', component: FactoriesComponent, canActivate: [AuthGuard],
resolve: [FactoriesResolverService],
children: [
{
path: ':index/factory', component: DetailsFactoryComponent, canActivate: [DetailsFactoryGuard]
},
{
path: ':index/factory/edit', component: EditFactoryComponent, canActivate: [DetailsFactoryGuard]
}
]
},
我有一些事情我不知道该怎么做
我尝试了以下方法:
private router: Router
private route: ActivatedRoute
this.router.navigate(['../']);
this.router.navigate(['../'], {relativeTo: this.route});
this.router.navigate(['../../'], {relativeTo: this.route});
this.router.navigate(['../..'], {relativeTo: this.route});
this.router.navigate([''], {relativeTo: this.route});
this.router.navigate(['/'], {relativeTo: this.route});
this.router.navigate(['../'], {relativeTo: this.route.parent});
所有导致重定向到主页/组件(网址:“”)
我无法使用硬路径 (this.router.navigate(['factories']);) 进行导航,因为我有另一个可以编辑工厂的路径,我也想返回到父路径(从'details/:index/factory/edit' 返回到 'details')
我试图通过警卫做到这一点,但是当用户刷新页面时,我的工厂数据正在重置(我使用 NgRX 状态来保存数据)。 我尝试使用解析器,但解析器仅在警卫之后调用,我无法从警卫导航或最终陷入无限循环
任何想法如何实施?
========================
关于第一个问题,我找到了一个解决方案:
const currUrl = this.route.snapshot['_routerState'].url.substring(1).split("/"); this.router.navigate([currUrl[0]]);
currUrl 将有一个包含完整 url 的数组 - 数组的第一个值是父路径
还在纠结第二个问题
您可以将索引保存为类中的属性并按该属性导航
export class Component implements OnInit {
index: string | number;
ngOnInit() {
this.index = this.route.snapshot.params['index'];
}
onNavigate() {
this.router.navigate(['/', this.index,'factory' ]);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.