Hacktoberfest 2026: as issues que os mantenedores marcaram para outubro, abertas e boas para iniciantes. Ver issues do Hacktoberfest

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

Aberta Para iniciantes
  • Algo errado?
#4,804 0 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 1 dia

Ninguém assumiu esta issue ainda.

Avaliação

Dificuldade
2/5
Tempo estimado
1-3 horas
Facilidade para iniciantes
82/100
Tipo de issue
Documentação
Clareza
Claramente especificada
Status de atividade
Ativa
Stack de tecnologia
angular, typescript
Domínio
documentation

Direção de pesquisa

Leia docs/developing/hardware-back-button.mdx e versioned_docs/version-v8/developing/hardware-back-button.mdx e compare os exemplos de abas do Angular com o comportamento relatado para páginas aninhadas. Atualize ambos os exemplos e a frase que os acompanha sobre consultar IonRouterOutlet com @ViewChild para usar o fluxo sugerido de NavController.pop(). O trabalho estará concluído quando ambas as versões explicarem e mostrarem a navegação de volta nas pilhas de abas antes de sair na raiz.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

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.

Linguagem predominante
MDX
Estrelas
620
Forks
3.2k
Merge médio
14h 27min
PRs com merge (30d)
46

Preparar o ambiente

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de ionic-team/ionic-docs

Todas as issues de ionic-team/ionic-docs

Issues semelhantes

Mais issues de Documentation

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.