ionic-team / ionic-team/ionic-framework

bug: Navigation stops working for nested ion-router-outlet

Abierto
#18,197 9 comentarios 11 reacciones 1 asignado Reclamado por @mhartington Ver en GitHub
package: angular type: bug
Lenguaje dominante
TypeScript
Estrellas
52.7k
Forks
13.3k
Merge medio
1 d 15 h
PR fusionados (30 d)
51

Descripción

# Bug Report

**Ionic version:**
[x] **4.3.1**

**Current behaviour:**

Using child-routes stops working using nested `ion-router-outlet`s.
Issues that could be related: #17638, #17825.

**1st**

If `links` and `ion-router-outlet` are placed inside `ion-content` links are not clickable.

```html

App One
App Two

```

If links are placed outside `ion-content` they are clickable.

```html

App One
App Two

```

**2nd**

Only the first navigation to a child route works.
After this, the view is not updated anymore.

![navigation-stops-working gif sb-3cdeef4e-ewqEiw](https://user-images.githubusercontent.com/444278/57130034-942dd900-6d98-11e9-9425-52d3c4749190.gif)

**Expected behaviour:**

- A click on a link should navigate to the corresponding component configured in the routing module.

**Steps to reproduce:**

- `git clone https://github.com/GregOnNet/ionic-4-jest-setup.git`
- `cd ionic-4-jest-setup.git`
- `git checkout routing`
- `npm install`
- `ionic serve`
- Visit http://localhost:8100/tabs/tab2
- Click on _App One_
- Click on _App Two_
- Note that navigation stops working

**Related code:**

- https://github.com/GregOnNet/ionic-4-jest-setup/tree/routing
- ⚠️ You need to checkout branch **routing**

**Ionic info:**

```
Ionic:

ionic (Ionic CLI) : 4.12.0 (/Users/gregor/.config/yarn/global/node_modules/ionic)
Ionic Framework : @ionic/angular 4.3.1
@angular-devkit/build-angular : 0.13.8
@angular-devkit/schematics : 7.3.8
@angular/cli : 7.3.8
@ionic/angular-toolkit : 1.5.1

System:

NodeJS : v10.15.3 (/Users/gregor/.nvm/versions/node/v10.15.3/bin/node)
npm : 6.4.1
OS : macOS Mojave
```

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.