angular - 如何从孙辈到 child

我有以下路线结构（角度5）

export const ROUTES = [
    { path: "", component: ParentComponent,
        children: [
            { path: "childpath/:param1/:param2/:param3", component: ChildComponent,
                children: [{ path: "grandchildpath", redirectTo: "", pathMatch: "full" },
                    { path: "grandchildpath/:param4/:param5", component: GrandchildComponent }]
            }
        ]
    }
];

当在ChildComponent我称路由"grandchildpath"（没有PARAMS）时，我想去"childpath/:param1/:param2/:param3"，但我得到了

Error: Cannot match any routes. URL segment: "childpath/:param1/:param2/:param3"

最佳答案

相对和绝对导航
导航可以是相对的，也可以是绝对的。
相对导航用不同的url段替换单个url段，或将routerLink中指定的路径附加到当前路径的末尾。
例子：
假设您当前的url是localhost:4200/child/1/2/3

<a [routerLink]="['grandchild',4,5]">Go</a>

这将导致currentpath+'/grandchild/4/5'
--> localhost:4200/child/1/2/3/grandchild/4/5

 <a [routerLink]="['/grandchild',4,5]">Go</a>

如果路径以“/”开头，则它是绝对导航。
这将导致currentpath+'/grandchild/4/5'
--> localhost:4200/grandchild/4/5
绝对导航取代了整个url。
当使用Router.navigate()方法导航到路由时，需要使用ActivatedRoute属性传递relativeTo的实例，因为navigate()方法不知道当前路由。
当使用RouterLink指令导航到路由时，不需要传递ActivatedRoute的实例，因为routerlink自动支持ActivatedRoute
解决方案1：使用routerLink指令
在child.component.html中

<a [routerLink]="['grandchild']">Grandchild Without Param</a><br>

解决方案2：
在child.component.ts中

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

      ngOnInit() {
      }

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

Live Demo

GrandChild

angular - 如何从孙辈到 child