javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-15 17:42:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(angular): NavController works with nested outlets (#28421)

Browse Source 
Issue number: resolves #28417

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

The common `IonRouterOutlet` was trying to inject another common
`IonRouterOutlet` into `parentOutlet`:
dc94ae01fe/packages/angular/common/src/directives/navigation/router-outlet.ts (L119)
None existed, so this field was `null`.

This is a problem if developers are using the module `IonRouterOutlet`
since parent router outlets will not be currently injected because
Angular is trying to use the common `IonRouterOutlet` not the module
`IonRouterOutlet`:
https://github.com/ionic-team/ionic-framework/blob/main/packages/angular/src/directives/navigation/ion-router-outlet.ts.
The same goes for the standalone `IonRouterOutlet`.

This resulted in things such as `NavController.pop` not working in
nested outlets because the parentOutlet was not defined.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- `IonRouterOutlet` now injects the correct router outlet instance for
`parentOutlet`

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

Dev build: `7.5.3-dev.11698328998.1a79f815`
This commit is contained in:
Liam DeBeasi
2023-10-27 09:17:42 -04:00
committed by GitHub
parent a5c68aa529
commit 90acad1837
7 changed files with 73 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
packages/angular/src/directives/navigation/ion-router-outlet.ts
View File

@ -1,8 +1,29 @@
import { Directive } from '@angular/core';
import { Location } from '@angular/common';
import { Directive, Attribute, Optional, SkipSelf, ElementRef, NgZone } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { IonRouterOutlet as IonRouterOutletBase } from '@ionic/angular/common';
@Directive({
selector: 'ion-router-outlet',
})
// eslint-disable-next-line @angular-eslint/directive-class-suffix
export class IonRouterOutlet extends IonRouterOutletBase {}
export class IonRouterOutlet extends IonRouterOutletBase {
/**
* We need to pass in the correct instance of IonRouterOutlet
* otherwise parentOutlet will be null in a nested outlet context.
* This results in APIs such as NavController.pop not working
* in nested outlets because the parent outlet cannot be found.
*/
constructor(
@Attribute('name') name: string,
@Optional() @Attribute('tabs') tabs: string,
commonLocation: Location,
elementRef: ElementRef,
router: Router,
zone: NgZone,
activatedRoute: ActivatedRoute,
@SkipSelf() @Optional() readonly parentOutlet?: IonRouterOutlet
) {
super(name, tabs, commonLocation, elementRef, router, zone, activatedRoute, parentOutlet);
}
}