Закрыть модал кнопкой Назад (Браузер) без изменения маршрута - PullRequest
Новая
       46

Закрыть модал кнопкой Назад (Браузер) без изменения маршрута

0 голосов
/ 13 марта 2019

Я видел недавние ответы, но никто не удовлетворился этим Ngx-bootstrap Modal с проблемой кнопки закрытия. Я использовал canDeactivate, чтобы не менять маршрут, когда модальный режим открыт

Вот что я сделал

этот openModal предназначен для открытия модального режима, при этом isModalOpen имеет значение false при закрытии, но «глобально я инициализировал его как true» 

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(() => this.changeDetection.markForCheck());
this.subscriptions.push(
  this.modalService.onHide.subscribe((reason: string) => {
    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) => {
    const _reason = reason ? `, dismissed by ${reason}` : '';
    console.log(`onHidden event has been fired${_reason}`);
    this.unsubscribe();
  })
);

this.subscriptions.push(_combine);
}

Это для закрытия модального 

closeModal(){
this.isModalOpen=false;
this.modalRef.hide();
 }

canDeactivate: 

canDeactivate(){
return this.isModalOpen;
}

Этот класс расширяет класс, который содержит openModal (), closeModal (), canDeactivate (). 

export class modalClose implements CanDeactivate<DynamicContentComponent>{
 canDeactivate(component: DynamicContentComponent,  route: 
  ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> | 
   boolean {
   console.log("canDeactivate");
  return component.canDeactivate();
  }
  }

приложение-routing.module.ts: 

{ 
path: ":ctype/:termid",   
component: DynamicContentComponent,
canDeactivate:[modalClose]
}

Я хочу закрыть модал с помощью кнопки «Назад» в браузере без изменения маршрута, и после того, как модальный закрытый маршрут хочет измениться, нажмите кнопку «Назад» ...!

...