Page embedded iframe click browser back problem

Page embed iframe Click the browser to go back

• stay iframe binding load event , In this way, you can listen to the open iframe Click browser back Button event ;

<div [hidden]="!iframePageDisplay" class="iframeStyle">
		<iframe [src]="iframeUrl" width="100%" height="100%" frameborder="0" id="message" name="nameOfThematicProgrammes" (load)='iframeOnload()'></iframe>
</div>

• load Incident , open iframe,push Go in one history;

iframeOnload(){
   if(this.iframePageDisplay){
      let state = {
          title: "title",
          url: window.location.href,
       };
       window.history.pushState(state, "title", state.url);
    }
}

• Add browser listening events

popstateHandler: any;

this.popstateHandler = this.backPopstate.bind(_this);
window.addEventListener('popstate', this.popstateHandler,true)

//  Browser return execution method 
backPopstate(){
   if(this.iframePageDisplay){
      this.iframePageDisplay = false;
      history.back();
      window.removeEventListener('popstate', this.popstateHandler, true);
   }
}

• Remove the added browser event ;

ngOnDestroy(){
	 window.removeEventListener('popstate', this.popstateHandler, true);
}