title: Close the modal by back button(Browser) without route change
body: <p>I saw recent answers,but none satisfied this <a href="https://valor-software.com/ngx-bootstrap/#/modals" rel="nofollow noreferrer">Ngx-bootstrap Modal</a>
  with the close button problem. 
  I used canDeactivate to not to change the route when modal is on open </p>
  
  <blockquote>
    <p>Here What i"ve done</p>
  </blockquote>
  
  <p>this openModal is to  open the modal here a isModalOpen  is set to false on close but "Globally i initialized it with true"</p>
  
  <pre><code>openModal(msg, isVideoPhoto: boolean, isVideo: boolean) {
  if (isVideo !== undefined) {
    this.modalRef = this.modalService.show(msg);
  
  }
  if (isVideoPhoto !== undefined) {
    this.modalService.config.backdrop = false;
  }
  
  const _combine = combineLatest(
  
    this.modalService.onHide,
    this.modalService.onHidden
  ).subscribe(() =&gt; this.changeDetection.markForCheck());
  this.subscriptions.push(
    this.modalService.onHide.subscribe((reason: string) =&gt; {
      const _reason = reason ? `, dismissed by ${reason}` : '';
      console.log(`onHide event has been fired${_reason}`);
      this.isModalOpen = false;
    })
  );
  this.subscriptions.push(
    this.modalService.onHidden.subscribe((reason: string) =&gt; {
      const _reason = reason ? `, dismissed by ${reason}` : '';
      console.log(`onHidden event has been fired${_reason}`);
      this.unsubscribe();
    })
  );
  
  this.subscriptions.push(_combine);
  }
  </code></pre>
  
  <p>This is for closing modal</p>
  
  <pre><code>closeModal(){
  this.isModalOpen=false;
  this.modalRef.hide();
   }
  </code></pre>
  
  <p>canDeactivate:</p>
  
  <pre><code>canDeactivate(){
  return this.isModalOpen;
  }
  </code></pre>
  
  <p>This class extends a class which contains openModal(),closeModal(),canDeactivate().</p>
  
  <pre><code>export class modalClose implements CanDeactivate&lt;DynamicContentComponent&gt;{
   canDeactivate(component: DynamicContentComponent,  route: 
    ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise&lt;boolean&gt; | 
     boolean {
     console.log("canDeactivate");
    return component.canDeactivate();
    }
    }
  </code></pre>
  
  <p>app-routing.module.ts:</p>
  
  <pre><code>{ 
  path: ":ctype/:termid",   
  component: DynamicContentComponent,
  canDeactivate:[modalClose]
  }
  </code></pre>
  
  <p>I want to close the modal with the back button of browser without any route change and after modal closed route wants to change on back button press...!</p>