How to elegantly get full url from the ActivatedRouteSnapshot?

There’s no ready to use function from Angular router to achieve that, so I wrote them:

function getResolvedUrl(route: ActivatedRouteSnapshot): string {
    return route.pathFromRoot
        .map(v => v.url.map(segment => segment.toString()).join("https://stackoverflow.com/"))
        .join("https://stackoverflow.com/");
}

function getConfiguredUrl(route: ActivatedRouteSnapshot): string {
    return "https://stackoverflow.com/" + route.pathFromRoot
        .filter(v => v.routeConfig)
        .map(v => v.routeConfig!.path)
        .join("https://stackoverflow.com/");
}

Example output when route is from ProjectComponent:

const routes: Routes = [
    {
        path: 'project', component: ProjectListComponent, children: [
            {path: ':id', component: ProjectComponent}
        ]
    },
];
getResolvedUrl(route) => /project/id1
getConfiguredUrl(route) => /project/:id

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)