ionic-team / ionic-team/ionic-docs

content: Example shows uncommon IonRouterOutlet usage

Abierto
#3,583 0 comentarios 0 reacciones 0 asignados Ver en GitHub
content package: angular
Lenguaje dominante
MDX
Estrellas
621
Forks
3.2k
Merge medio
1 d 2 h
PR fusionados (30 d)
86

Descripción

### 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();
}
});
}
```

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.