Angular 角度9-路线

我9岁时是个新手

以下是我的路线：

-->然后进入登录

--它工作正常，但当我登录时，仪表板会覆盖id（PC2）

--应该是

以下是我的路线：

const routes: Routes = [
    { path: '', children:[
        { path: '', redirectTo: 'pc_configuration', pathMatch:'full' },
        { path: 'pc_configuration', component: PcConfigComponent },
        { path: ':id', children:[
            { path: '', redirectTo:'login', pathMatch:'full'},
            { path: 'login', component: Login2Component },
            { path: 'dashboard', component: DashboardComponent},
        ]}  
    ]},
];

这是我的登录方式：

import { Router } from '@angular/router';

export class Login2Component {

    constructor(private route:Router){}

    onLogIn(){       

        this.route.navigateByUrl('/dashboard');

    }
}

---

我做错了什么？

你有两个选择，我可以考虑

导航到完整路线，包括您的参数

导航到相对于当前路线的路线

无论哪种方式，您都需要注入当前路由，即

ActivatedRoute

的实例

导航到完整路线 您需要从路由中获取当前的

id

param

从'@angular/Router'导入{Router，ActivatedRoute}；
导出类Login2Component{
构造函数（专用路由：路由器，专用路由：ActivatedRoute）{}
onLogIn（）{
const id:string=this.route.snapshot.params.id；
this.route.navigateByUrl（`/${id}/dashboard`）；
}
}

导航到相对路线 您可以使用

。/{sibling}

模式导航到同级路由，并指定

relativeTo:this.route

从'@angular/Router'导入{Router，ActivatedRoute}；
导出类Login2Component{
构造函数（专用路由：路由器，专用路由：ActivatedRoute）{}
onLogIn（）{
this.route.navigate（[`../dashboard`]{
这条路线
});
}
}

哪个更好？

---

尽管选项2看起来更干净，但我个人更喜欢选项1。这意味着您可以重构路由层次结构，而不用担心破坏相对导航。不过这只是我的观点。这两种选择在技术上都是可以接受的。

您需要相对于当前路线导航。这样更好，您就不需要跟踪PC:id

constructor(private router: Router,
            private route: ActivatedRoute) {}

....
this.router.navigate(['dashboard'], {relativeTo: this.route});
...