angular-router

I have tried to reproduce my error in a stackblitz What I try to accomplish I am trying to have a route with a dynamic parameter, and have sub routes of that parameter. I want this module to be lazyloaded. I have made a working solution for the dynamic parameter using the :id definition in the route definition. I want the child routes to output in a different router-outlet. Specifically I want a component ( UserComponent ) loaded on the route user/:username - if the path is empty after the :username I want to load UserDefaultContentComponent in the router defined inside the UserComponent - If

I have dynamic routes that could contain slashes or anti-slashes inside parameters , for example: http://localhost:4200/dashboard/T64/27D I should navigate to a page with route T64/27D Here's how I navigate this.router.navigate(['dashboard/'+this.groupListPage[0].code]); this.groupList[0].code contain T64/27D Actually Angular separate T64 and 27D as 2 different pages. Here's the error: ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'dashboard/T64/27D' Error: Cannot match any routes. URL Segment: 'dashboard/T64/27D' How can I tell to Angular that / is a part of

There have been so many alterations to the Angular router as of late I don't know how to go about this. I have a param on my parent component called "eventId" which is in the address bar: http://localhost:4200/event/1 In this case it's value is 1. Here's how I declare it in the routing component: { path: 'event/:eventId', loadChildren: './event/event.module#EventModule', canActivate: [AuthGuard] }, So I have a child component which is way down the line: http://localhost:4200/event/1/event-travel-agents/purchase-plans On my purchase plans component, how can I get the eventId? I've tried: import

I'm trying to add a new menu item to the default generated JHipster app. I'm using Angular 4 by the way. The problem I'm facing is that I'm always getting the error below. Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'user-profile' The following are the codes I added. Firstly, I added a folder named user-profile under src/main/webapp/app. In it, I added index.ts, user-profile.component.html, user-profile.component.ts and user-profile.route.ts The contents of index.ts export * from './user-profile.component'; export * from './user-profile.route'; The contents of

I am unable to get the URL nor the path from ActivatedRoute nor Router imports. It outputs a blank for path "" and '/' for URL. I remember using a working version. The only thing that captures the right route the Router.events. I am also unable to subscribe to the URL in the ActivatedRoute. Here is the code import { Component, OnInit, ViewChild, ElementRef } from '@angular/core'; import { Router, ActivatedRoute, UrlSegment, NavigationStart, RoutesRecognized } from '@angular/router'; @Component({ selector: 'api-dashboard', templateUrl: './dashboard.component.html', styleUrls: ['./dashboard

So I am trying to hide my routes on the url, that means i want my app to show always the url as being in the root app, for example: "www.foo.com" instead of "www.foo.com/login" Its there any way to achieve this in angular 2? Thanks in advance for the help! What you are looking for is Angulars skipLocationChange , this is what Angular refers to as "NavigationExtras". Here is the documentation: Angular docs on NavExtras // Navigate silently to /view this.router.navigate(['/view'], { skipLocationChange: true }); 来源： https://stackoverflow.com/questions/49407520/hiding-routes-on-url-angular-2