Passing parameters to children components in ionic-CodePudding

i have a parent page and three children pages i am using ionic router-outlet to navigate between :

parent.page.html

    <ion-content>
        <ion-router-outlet></ion-router-outlet>
    </ion-content>

parent-routing-module.page.ts

    children: [
      {
        path: 'child-one',
      },
      {
        path: 'child-two',
      },
      {
        path: 'child-three',
      }
    ]

I want to pass data from the parent page to the children pages on each navigation with the router-outlet how can i do that ?

CodePudding user response：

Ionic routing is basically handled by angular routing, so you have to search for angular solutions in these matters.

If that is something related to your child page, the main way is to pass the string data in the child page's url, like this:

children: [
      {
        path: 'child\:myVariable',
      }
    ]

and in your child page:

constructor(private route: ActivatedRoute) {
}
...
ngOnInit() {
    const myVar = this.route.snapshot.paramMap.get('myVariable');
}

Alternatively you can use angular services, which are injected in root and you can have your data accessible anywhere in your app.