How to get :id param of child route from parent component in Angular2

You can use the firstChild property or the ActivatedRoute to get the child route:

route.firstChild.snapshot.params['id']

To get the child's params inside the parent component, i used the firstChild property of ActivatedRoute, because i only have on child route

route: ActivatedRoute

route.firstChild.params.subscribe(params => {
  let id = +params['id'];
});

Recursively finding child params wont always get you the params you are looking for. Specially when moving routes around.

Instead, an RxJS ReplaySubject can be used to publish the current child id.

Create a new service:

@Injectable()
export class ChildIdService  {
  current$ = new ReplaySubject<number>();
}

Import it on the child component and subscribe to the replay subject:

export class ChildComponent implements OnInit {
  constructor(private ar: ActivatedRoute, public ci: ChildIdService){}

  ngOnInit(){
    this.ar.params.map(params => +params.id).subscribe(this.ci.current$);
  }
}

Import the service on the parent component and use the async pipe to subscribe to the child value:

<span>Mother component child ID: {{ci.current$ | async}}</span>

Here is a working snippet: https://stackblitz.com/edit/angular-b8xome (add /child/42 to the browser app preview to see it working)

---

Alternatively define the components as siblings and add the parent as a componentless route, ex.: https://vsavkin.com/the-powerful-url-matching-engine-of-angular-router-775dad593b03 under "Sibling Components Using Same Data"