As the warning says, work-session-list.routing.ts depends on index.ts: import { WorkSessionListComponent } from ‘./index’; And index.ts depends on work-session-list.routing.ts: export * from ‘./work-session-list.routing’; The first dependency is not necessary, since you could import WorkSessionListComponent directly from its source file: import { WorkSessionListComponent } from ‘./work-session-list.component’; This change should fix the problem.
for those not using a Staticfile might wanna try this. I had the same problem with nginx serving angular. The following is the default config file, probably found somewhere in /etc/nginx/sites-available/yoursite location / { # First attempt to serve request as file, then # as directory, then fall back to displaying a 404. try_files $uri … Read more
You can use angular routers replaceUrl flag to do this. See api docs for more details here this.router.navigate([‘/view’], { replaceUrl: true });
To navigate to particular link from current url, you can do something like this, constructor(private route: ActivatedRoute, private router: Router){} ngOnInit() { this.route.params.subscribe(params => { // PARAMS CHANGED .. let id = params[‘projectid’]; }); } navigate(){ this.router.navigateByUrl(this.router.url.replace(id, newProjectId)); // replace parameter of navigateByUrl function to your required url } On ngOnInit function, we have subscribed … Read more
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 … Read more
I got this error because I somehow accidentally imported the root AppModule into my lazy-loaded module. This caused the root AppRoutingModule to be called again when the lazy-loaded module was loaded, and thus RouterModule.forRoot was called twice. If you are certain you aren’t calling RouterModule.forRoot twice then this could be the cause of the issue. … Read more
Edit: the problem is that I was trying to access the ActivatedRoute from a Component which is outside the <router-outlet>. So it looks like that this is the intended behaviour. However I still think that my answer below can be useful to anyone who is trying to accomplish the same thing. I found a workaround … Read more
You can pass in a second argument with options: imports: [ RouterModule.forRoot( routes, { enableTracing: true } // <– debugging purposes only ) ] Angular will then log all events to the browser’s console, per the documentation: enableTracing?: boolean When true, log all internal navigation events to the console. Use for debugging.
You can solve your problem using child routes. See working demo at https://angular-multi-layout-example.stackblitz.io/ or edit at https://stackblitz.com/edit/angular-multi-layout-example Set your route like below const appRoutes: Routes = [ // Site routes goes here { path: ”, component: SiteLayoutComponent, children: [ { path: ”, component: HomeComponent, pathMatch: ‘full’}, { path: ‘about’, component: AboutComponent } ] }, // … Read more
Since ActivatedRoute can be reused, ActivatedRouteSnapshot is an immutable object representing a particular version of ActivatedRoute. It exposes all the same properties as ActivatedRoute as plain values, while ActivatedRoute exposes them as observables. Here is the comment in the implementation: export class ActivatedRoute { /** The current snapshot of this route */ snapshot: ActivatedRouteSnapshot; If … Read more