Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

content: Angular "Exiting the App" example exits from pages nested under ion-tabs

Offen Anfängerfreundlich
  • Stimmt etwas nicht?
#4,804 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Anfängerfreundlichkeit
82/100
Issue-Typ
Dokumentation
Klarheit
Klar beschrieben
Aktivitätsstatus
Aktiv
Tech-Stack
angular, typescript
Bereich
documentation

Rechercherichtung

Lies docs/developing/hardware-back-button.mdx und versioned_docs/version-v8/developing/hardware-back-button.mdx und vergleiche die Angular-Tabs-Beispiele mit dem berichteten Verhalten bei verschachtelten Seiten. Aktualisiere beide Beispiele und den begleitenden Satz zur Abfrage von IonRouterOutlet mit @ViewChild, sodass sie den vorgeschlagenen NavController.pop()-Ablauf verwenden. Die Aufgabe ist abgeschlossen, wenn beide Versionen die Zurück-Navigation in Tab-Stacks erklären und zeigen, bevor die App am Stammverzeichnis beendet wird.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

content
URL

https://ionicframework.com/docs/developing/hardware-back-button#exiting-the-app

Issue Description

The Angular examples under "Exiting the App" query the root IonRouterOutlet with @ViewChild and exit when canGoBack() is false. In an app that uses ion-tabs, pages inside a tab are stacked in the tab's own outlet, so the root outlet's stack only ever holds the tabs page and canGoBack() is always false. On a page such as /tabs/home/detail, pressing the hardware back button exits the app instead of going back to /tabs/home.

Measured on @ionic/angular 9.0.9:

Layout, page Root outlet canGoBack() NavController.pop() resolves Example
Flat, one page deep true true stays
Flat, root false false exits
Tabs, /tabs/home/detail false true exits (wrong)
Tabs, /tabs/home false false exits

NavController.pop() walks from the active outlet up through its parents, so its result is the reliable signal. Suggested replacement for both Angular tabs (import from @ionic/angular/lazy for the modules example):

import { Component, inject } from '@angular/core';
import { NavController, Platform } from '@ionic/angular';
import { App } from '@capacitor/app';

@Component({ ... })
export class AppComponent {
  private platform = inject(Platform);
  private navCtrl = inject(NavController);

  constructor() {
    this.platform.backButton.subscribeWithPriority(1, async () => {
      const popped = await this.navCtrl.pop();
      if (!popped) {
        App.exitApp();
      }
    });
  }
}

Priority 1 runs before the built-in navigation handler (priority 0) and after menus and overlays (99 and 100), so it takes over the back navigation itself. The sentence about querying IonRouterOutlet with @ViewChild would need to change with it.

Both docs/developing/hardware-back-button.mdx and versioned_docs/version-v8/developing/hardware-back-button.mdx carry the same example.

Reported in ionic-team/ionic-framework#31598.

Vorherrschende Sprache
MDX
Sterne
620
Forks
3.2k
Ø Merge
15 Std. 17 Min.
Gemergte PRs (30 T.)
52

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus ionic-team/ionic-docs

Alle Issues in ionic-team/ionic-docs

Ähnliche Issues

Weitere Issues zu Documentation

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.