How to call router outlet child component method from parent comonent

Question

I am new to angular2

I have a button in parent component, if

Answer 1

After i searched a lot about this issue, i found a solution and wish it could help you. contentChild/ViewChild have no access to component(and it's data) that is loaded in router-outlet, and using sharedService needs an extra file and more code.

You just need to read component that is loaded in the router outlet:

1. Add template reference to your router outlet:

2. Import the RouterOutlet from @angular/router :

   import {...
      RouterOutlet,
      ..} from "@angular/router";
   

3. And finally, use it:

   @ViewChild("myRouterOutlet", { static: true }) routerOutlet: RouterOutlet;
   buttonClicked(){
       const childComp = this.routerOutlet.component as childComponent;
       childComp.childFunction();
   }
   

Hope it could help you :)