I need to create several paths dynamically in my routing since the values ​​will be added to the sidebars through an endpoint.

By creating a new item for the sidebar, the user will be specifying the path values ​​for each menu.

The value for the path entered by the user is the one that should be added in the routing.

All paths will be using the same component but the data to be displayed is validated by the path

loadDynamicRoutes() {
    this.routesService.getRoutes().subscribe((routes: any[]) => {
      const dynamicRoutes = routes.map(route => ({
        path: route.path,
        component: AdminRolesComponent
      }));

      this.router.resetConfig([...staticRoutes, ...dynamicRoutes]);
    });
  }

This is an example of my code but I don’t know how to add it to the routing.

Is there an easier way to leave my sidebar and paths dynamic?