Angular 根据json文件路由到动态位置

我有一个json文件，其中包含菜单信息及其路由链接：

app.component.ts：

this.menusList = [
    {label:'Alerts',
    items: [
                    {label: 'Alert-New', icon: 'pi pi-fw pi-plus', routerLink: 'pagename'}

           ]
    },

    {label:'Group',
    items: [
                    {label: 'Group-Create', icon: 'pi pi-fw pi-plus', routerLink: 'group-create'},
                    {label: 'Group-Manage', icon: 'pi pi-fw pi-download', routerLink: 'group-manage'},
                    {label: 'Group-Upload', icon: 'pi pi-fw pi-upload', routerLink: 'group-create'}
                ]
    },

    {label:'Location',
    items: [
                    {label: 'Location-Create Temporary', icon: 'pi pi-fw pi-plus', routerLink: 'location-create-temporary'},
                    {label: 'Location-Manage', icon: 'pi pi-fw pi-download', routerLink: 'location-manage'},
                    {label: 'Location-Related Groups Search', icon: 'pi pi-fw pi-upload', routerLink: 'location-related-group-search'}
                ]
    }

    ]

现在，我可以使用ngFor获得如下值（我使用的是primeNG）：

---

但是现在有了动态链接，我如何导航到相应的组件？请帮帮我。谢谢。

要做到这一点，您可以使用

router.resetConfig

或

router.config.push

路由器.重置配置：

重置用于导航和生成链接的配置

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

const config = this.router.config;
config.push({
        path: 'dynamicRoutePath',
        component: DynamicRouteComponent,
    });

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

路由器.config.push：

动态更新路由配置和触发导航

this.router.config.push({ path: 'somePath', component: SomeComponent });

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

const config = this.router.config;
config.push({
        path: 'dynamicRoutePath',
        component: DynamicRouteComponent,
    });

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

this.router.config.push({ path: 'somePath', component: SomeComponent });