angular-router

Assuming I have two Angular 2 components: ComponentA and ComponentB . I want to be able to navigate from ComponentA to ComponentB and then eventually back to ComponentA, while not having to reinitialize ComponentA. In the current Angular 2 Router implementation, every time I navigate away from a component, the component gets destroyed and has to be recreated the next time I navigate to it. I know that I can preserve the state of components by using a Service, but this seems to be more like a workaround than an actual solution to my issue. Is there any way around this? 来源： https://stackoverflow

I am struggling with Angular framework to get my application run smoothly, but I can't resolve an issue with routing. I have a top level AppComponent and app-routing.module.ts which manage the navigation via my custom SlideMenuComponent . My simplified html template of AppComponent : <app-slide-menu [buttons]="menuButtons"></app-slide-menu> <router-outlet></router-outlet> My SlideMenuComponent has the following html as its core: <nav><div *ngFor="let button of buttons"> <a routerLink="{{button.routerLink}}" >{{button.name}}</a> </div></nav> A user can navigate to '/courses' through this slide

I have Angular 4.3.6 project where a template snippet produces this error. Template block: <a [routerLink]="['/article',article?.id]">{{article?.title}}</a> Error stack trace: ArticleSpComponent.html:26 ERROR TypeError: Cannot read property 'outlets' of null at createNewSegmentGroup (router.es5.js:2967) at updateSegmentGroup (router.es5.js:2896) at router.es5.js:2914 at forEach (router.es5.js:593) at updateSegmentGroupChildren ( The error cause seems to be obvious. article variable is fetched async from Http and initialized after page is rendered so firstly it's null. However I thought that

I am using Angular 7 and facing an issue => after login the API GET calls successfully and the component receiving data too, but UI is not displaying that data. When I open the browser console, immediately the data gets populated on the UI and a warning is showing in the console. "core.js:15686 Navigation triggered outside Angular zone, did you forget to call 'ngZone.run()'?" I have googled this warning and found some workaround like this.ngZone.run() and call my API's inside it. But the issue is, I am using more than 40 components and calling so many API in each component. So I have to call

I have a little problem using routes in angular 4. You know, when I am trying to pass data from a component to another using navigate('root', data) , I just received [object Object],[object Object],[object Object] . Component export class FillRequestComponent implements OnInit { constructor(private route: Router, private dataRoute: ActivatedRoute) { } ngOnInit() { const key: Products = this.dataRoute.snapshot.params['objectProducts']; console.log(key); } Interface export interface Products { color: string, question: string, surname: string, icon: string, selected: boolean, transparent: boolean

I had a problem recently, and found no tips on how to get it work. When I use ActivatedRoute in order to get data from my Routes, angular failed to compile and say Property 'map' does not exist on type 'Observable<Data>'. I tried everything like : import { map } from "rxjs/operators"; import 'rxjs/operators'; or even import 'rxjs/add/operator/map'; but the error persists. Here is the route path that I have : { path: 'home', component: HomeComponent, data: { title: "Accueil" } }, { path:'projets', component: ProjectsComponent, data: { title: "Projets"} } and the component code: constructor

I have a route with route children like this: { path: 'dashboard', children: [{ path: '', canActivate: [CanActivateAuthGuard], component: DashboardComponent }, { path: 'wage-types', component: WageTypesComponent }] } And in the browser I want to get the activated parent route like host.com/dashboard/wage-types How to get the /dashboard but possible with Angular 2 and not in JavaScript, but also I can accept JavaScript code too but primary Angular 2. peppermcknight You can do this by using the parent property on the ActivatedRoute - something like this. export class MyComponent implement OnInit

My problem is that I have a lang.component loaded with <router-outlet> . What I need is to access ActivatedRoute params in the root component which is app.component but all route data there is empty. I am able to access route data from lang.component normally by subscribing to params link to code that you can run: https://plnkr.co/edit/gTXPUb6TvatbMyOPPRKj If you run the code and open your console you can see two logs. It shows you what the problem is. Please help. Thank you. Instead of using ActivatedRoute use Router. this.router.events.subscribe((event) => { if(event instanceof NavigationEnd