角度4动态路由参数

时间:2017-11-12 07:18:40

标签: angular angular4-router

在我的Angular 4项目中,我在路线上有一个容器组件:

  

{path:' someComponent',component:SomeComponentContainerComponent},

访问时,它会随机在此容器组件中创建一个或多个SomeComponent实例,并将URL更改为如下所示:

  

'本地主机:4200 / someComponent / ID1 / ID2 / ID3 /...&# 39;

id的数量取决于创建的实例数。如果用户访问具有一个或多个可选id的上述URL,则应由容器对象处理,以创建具有给定ID的SomeComponent的相应数量的实例。

对于这些可选路由参数的静态数量,我可以尝试以下方法:

  

{path:' someComponent',component:SomeComponentContainerComponent},

     

{path:' someComponent /:id1',component:SomeComponentContainerComponent},

     

{path:' someComponent /:id1 /:id2',component:SomeComponentContainerComponent},

     

...

我的问题是,当它们的数量不总是相同时,如何捕获这些可选路由参数?

非常感谢任何帮助,提前谢谢。

1 个答案:

答案 0 :(得分:0)

以下解决方案对我有用:

在module.ts中

{
    path: 'someComponent',
    children: [{path: '**', component: SomeComponentContainerComponent}]
}

并在component.ts中

constructor(private route: ActivatedRoute){}

ngOnInit(){
    this.route.url.subscribe((segments: UrlSegment[]) => {
        for(var i = 0; i < segments.length; i++){
            console.log("param: " + segments[i]);
        }
    });
}