ionic-team / ionic-team/ionic-docs
content: Example shows uncommon IonRouterOutlet usage
- Langage dominant
- MDX
- Étoiles
- 621
- Forks
- 3.2k
- Merge moyen
- 1 j 2 h
- PR mergées (30 j)
- 86
Description
### URL
https://ionicframework.com/docs/developing/hardware-back-button#exiting-the-app
### Issue Description
On the linked page (I am referencing the `Angular (Standalone)` tab), the `IonRouterOutlet` is injected via the constructor.
However, this only works if it used in a subcomponent of the app and not in `AppComponent` and, I would argue that this is a rather uncommon use-case, as the usual developer probably only wants to add it to the top-most component.
In my case, I had to search for quite some time to find a really neat solution in the following issue comment, and according to the reactions I am not alone (note that the issue is also locked since nearly 4 years!):
https://github.com/ionic-team/ionic-framework/issues/21630#issuecomment-683007162
IMO, the docs example should show a working way of implementing the default behavior (like in native Android apps) in a straightforward way like:
```ts
import { ViewChild } from '@angular/core';
import { IonRouterOutlet, Platform } from '@ionic/angular/standalone';
import { App } from "@capacitor/app";
// ...
@ViewChild(IonRouterOutlet, {static: true}) routerOutlet?: IonRouterOutlet
constructor(private platform: Platform) {
this.platform.backButton.subscribeWithPriority(-1, () => {
if (this.routerOutlet && !this.routerOutlet.canGoBack()) {
App.exitApp();
}
});
}
```
Guide de contribution
Ouvrir le guide de contribution
Évaluation
Cette issue n'a pas encore été évaluée.