after close Interstitial ad then angular not able to detect changes on next page in capacitor/ionic

Issue

Homepage.ts

//all imports 
 async ionViewWillEnter() {
    this.init();
    // this.zone.run(async () => {
    this.InterDish = await AdMob.addListener(InterstitialAdPluginEvents.Dismissed, () => {
      console.log("Interstitial Dismissed");
      this.nextpage();
    });
    this.InterLoadFailh = await AdMob.addListener(InterstitialAdPluginEvents.FailedToShow, () => {
      console.log("Iterstitial FailedToShow");
      this.nextpage();
    });
    // });
  }

  ionViewWillLeave() {
    this.InterDish.remove();
    this.InterLoadFailh.remove();
  }

nextpage.html

<ion-segment [(ngModel)]="Design" (ionChange)="segmentChanged($event)">
      <ion-segment-button value="new">
        new
      </ion-segment-button>
      <ion-segment-button value="old">
        old
      </ion-segment-button>
      <ion-segment-button value="other">
        Other
      </ion-segment-button>
    </ion-segment>

when ads is disply and if i close the ad and on the "nextpage" segment not change, if i add write this this.cdr.detectChanges(); code then only it detect change, and if ad not display then it work correctly .

Solution

use ngZone

import { NgZone } from '@angular/core';

constructor(
   private zone: NgZone,    
) { }

this.InterDish = AdMob.addListener(InterstitialAdPluginEvents.Dismissed, () => {
  this.zone.run(() => {
     console.log("Interstitial Dismissed");
     this.nextpage();
  })
});

Answered By - Najam Us Saqib