Search code examples
angulartypescriptangular2-routingrouter-outlet

angular 2 passing parameters to named router-outlet?


I am sending parameters through named router-outlet to my ChildComponent. But in child component when i try to access params they are undefined.

Here is the route-config file

{ path: 'contact-hold/:id', component: OperationComponent, outlet: 'popup' }

Here is my link:

<a [routerLink]="['\',{outlets:{popup:['hold',1]}}]">Hold</a>

Here is what is looks like in browser:

/contact-list(popup:contact-hold/1)

And here is my router-outlet which i have kept in AppComponent:

<router-outlet name="popup"></router-outlet>

I am accessing this param like this in my Operation Component:

this.route.queryParams.subscribe(params=> {      
      console.log(params["id"]);
    })  

I have gone trough other questions in stackoverflow and implemented the solution but still it's not working. What might be wrong with this code?


Solution

  • Try this :

    import { ActivatedRoute } from '@angular/router';
    
    routeSub: any;
    
    constructor(
        private route: ActivatedRoute
    ) {}
    
    this.routeSub = this.route.params.subscribe((params) => {
        console.log('params', params);
    })