ionic-team / ionic-team/ionic-framework

bug(nav): lifecycle events inside ion-nav fire incorrectly

Đang mở
#25,675 8 bình luận 4 reaction 0 người được giao Xem trên GitHub
package: angular type: bug
Ngôn ngữ chính
TypeScript
Star
52.7k
Fork
13.3k
Merge trung bình
1 ngày 15 giờ
Pull request đã merge (30 ngày)
51

Mô tả

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

- [ ] v4.x
- [ ] v5.x
- [X] v6.x
- [ ] Nightly

### Current Behavior

I've come across with some strange behaviour, when you present a page using `ModalController`which wraps `ion-nav`.

### Parent Page

```typescript
public async openModal() {
const modal = await this.modalController.create({
component: ModalOutletPage,
componentProps: { component: AddCardPage },
});

await modal.present();
}
```

### Modal Outlet Page

```typescript
export class ModalOutletPage implements OnInit {
@Input() public component: HTMLElement;
@Input() public componentProps: unknown;
}
```

```html

```

in this test i console.log() `ionViewDidEnter()`, `ionViewDidLeave()`, `ngOnInit()`, `ngOnDestroy()` inside `add-card.page.ts`

### First time opening modal:
#### on open
1. ionViewDidEnter trigger
#### on close
1. ngOnInit trigger
2. ngOnDestroy trigger

### second time opening modal:
#### on open
1. ngOnInit trigger
2. ionViewDidEnter trigger twice
3. ionViewDidLeave trigger
4. ngOnDestroy trigger
#### on close
1. ngOnInit trigger
2. ngOnDestroy trigger

https://user-images.githubusercontent.com/26873275/180785472-225256f1-c1d7-4e4c-a752-b37317ac55e9.mov

#### UPDATE
This is the behaviour, if i remove `changeDetection: ChangeDetectionStrategy.OnPush` inside `modal-outlet.page.ts`:

https://user-images.githubusercontent.com/26873275/180788325-724afcbb-c291-46ff-9a41-956a099e40fb.mov

### Expected Behavior

Lifecycle events should trigger correctly

### Steps to Reproduce

see video

### Code Reproduction URL

https://github.com/DwieDima/ion-nav-lifecycle-bug

### Ionic Info

Ionic CLI : 5.4.16
Ionic Framework : @ionic/angular 6.1.15
@angular-devkit/build-angular : 14.1.0
@angular-devkit/schematics : 13.2.6
@angular/cli : 14.1.0
@ionic/angular-toolkit : 6.1.0

Utility:

cordova-res : not installed
native-run : not installed

System:

NodeJS : v16.14.2
npm : 8.5.0
OS : macOS Monterey

### Additional Information

maybe related to #25638

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.