Closed indraraj26 closed 4 years ago
Thanks for the issue. I am going to close this as this is not a bug in Ionic Framework. The first issue is occurring when you try to inject IonRouterOutlet
outside of your app's ion-router-outlet
component. For example, this can happen if you try to inject it into your app.component.ts
file.
Injecting IonRouterOutlet
requires that you inject it into a component inside of the ion-router-outlet
element you want to have access to.
app.component is the only which will not be killed during the lifetime of app. Where should i inject IonRouterOutlet and listen to back button ?
this.platform.backButton.subscribeWithPriority(-1, async (_) => {
console.log(
this._ionRouterOutlet.component,
);
if (!this._ionRouterOutlet.canGoBack()) {
await this._app.minimize();
}
});
If you want to use the dependency injection, you need to inject it into a component that exists inside of ion-router-outlet
. Otherwise, you can use a querySelector
to select the component yourself.
@liamdebeasi , how would you test the IonRouterOutlet in the spec.ts
files? I keep getting the NullInjection errors as described above.
You can define a property in the app.component.ts like:
@ViewChild(IonRouterOutlet, { static : true }) routerOutlet: IonRouterOutlet;
and then use it like this.routerOutlet.canGoBack()
.
Unfortunately querySelector
is not a proper answer and got lost me for a while.
Hopes that it'll be helpfull for anyone who gets here like me :)
Thanks a lot @rtbm for sharing the way to get rid of querySelector
Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.
Bug Report
Ionic version:
[x] 5.x
Current behavior:
I have injected IonRouterOutlet to check canGoBack and getting this error
So i have added in app.module.ts of providers array but now getting this error
Expected behavior:
It should not through error
Steps to reproduce:
Related code:
Repository: https://github.com/indraraj26/ionic5-starter-tabs-sidemenu/tree/handle-back-button Branch: handle-back-button
Other information:
Ionic info: