Angular 2路由器不能处理传递的多个参数
发布时间:2020-12-17 17:56:32 所属栏目:安全 来源:网络整理
导读:我创建了一个示例plunker,将多个参数传递到下一页,但它不起作用.这是一个plunker演示,点击项目后危机中心路由不起作用. http://plnkr.co/edit/ngNSsKBzAuhaP0EjKVJX?p=preview onSelect(crisis: Crisis) { // Navigate with Absolute link //this.router.nav
我创建了一个示例plunker,将多个参数传递到下一页,但它不起作用.这是一个plunker演示,点击项目后危机中心路由不起作用.
http://plnkr.co/edit/ngNSsKBzAuhaP0EjKVJX?p=preview onSelect(crisis: Crisis) { // Navigate with Absolute link //this.router.navigate(['/crisis-center',1]); //this is working. this.router.navigate(['/crisis-center',{ id: '1',id2:'2'}]); //this is not working } //下面是路线: //{ path: 'crisis-center/:id',component: CrisisDetailComponent } //-- this is working { path: 'crisis-center/:id /:id2',component: CrisisDetailComponent},// this is not working ngOnInit() { this.sub = this.route .params .subscribe(params => { let id = +params['id']; let id2 = +params['id2']; //Unable to read id and id2 values this.service.getCrisis(id) .then(crisis => { if (crisis) { this.editName = crisis.name; this.crisis = crisis; } else { // id not found this.gotoCrises(); } }); }); } 我有三个分层导航,它从危机中心转移到危机细节,然后从危机细节转移到> transactiondetail.因此,在我导航到危机细节之后,我想通过危机等待和危机等待,以便遍历细节,然后再回到危机清单. 我试图传递多个参数在这里有人有这个问题? 此外,我想隐藏浏览器URL中的URL参数并显示别名,以前用作“as”关键字现在它不起作用. 任何帮助赞赏 解决方法
使用路由器组件(来自’@ angular / router’,而不是’@ angular / router-deprecated’),您将传递多个参数,如下所示:
this.router.navigate(['/crisis-center',1,2]); 你试图这样做: this.router.navigate(['/crisis-center',id2:'2'}]); //this is not working 因为您已将对象作为第二个参数传递,所以您传递的是查询参数而不是路由器参数.所以,它的URL是: localhost:3000/crisis-center;id=1&id2=2 你可以在这里阅读更多相关信息:https://angular.io/docs/ts/latest/guide/router.html#!#query-parameters (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |