代码之家 › 专栏 › 技术社区 › user2175783

如何从孙子到孩子

url-routing angular5 routes angular

3

user2175783 · 技术社区 · 8 年前

我有以下路线结构(角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" "childpath/:param1/:param2/:param3" 但是我得到了

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

1 回复 | 直到 8 年前

1

2

Vikas RyanSand20 8 年前

相对和绝对导航
导航可以是相对的,也可以是绝对的。相对导航将单个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>

如果路径以/开头,则它是绝对导航。

这将导致 当前路径+'/孙子/4/5' localhost:4200/grandchild/4/5

使用导航到路线时 Router.navigate() ActivatedRoute 使用 relativeTo 财产因为 navigate() 方法不知道当前路由。
使用导航到路线时 RouterLink 激活路线 激活路线

解决方案1: 路由器链接 指令
在你的子组件.html

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

在你的子组件.ts

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

      ngOnInit() {
      }

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

Live Demo