Angular 2-ngb模态对话框的行为不像Confirm

问题描述

我的应用程序“ OverviwComponent”，“ DetailsComponent”和“ SettingsComponent”中有3个视图。 我也有路由和守卫。当用户尚未保存并从详细信息页面导航到任何其他页面时->我想显示模式警告对话框（使用NgbModal）

问题：模式对话框的行为不像JS'confirm（）'（暂停脚本执行）。

@Injectable({
  providedIn: 'root'
})
export class CanDeactivateGuard implements CanDeactivate<DetailsComponent> {
  canDeactivate(component: DetailsComponent): boolean {
    console.log('------CanDeactivateGuard triggered------');
    if(component.userEditedStuffOnUi) {
      //display modal from details.html
      component.modalService.open(component.userLeavesModalRef,{ size: 'm' }).result.then(
        (result) => {
          console.log('result: '+result);
          if(result=='leave'){
            console.log('leaving..');
            return true;
          }
          else if(result=='stay') return false;
        },(reason) => {
          console.log(component.getdismissReason(reason));
          return false;
        }
      );
    /* //Code below works fine
      if (confirm("You have unsaved changes! If you leave,your changes will be lost.")) {
          return true;
      }
      else return false;
      */
    }
    else return true;
  }
}

    <ng-template #userLeavesModal let-modal>
        <div class="modal-header">
            <div class="modal-title" id="modal-basic-title">Leaving this page</div>
            <button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')">
                <span aria-hidden="true" class="x-close">&times;</span>
            </button>
        </div>
        <div class="modal-body">
            <div class="container-fluid">
                <div class="row">
                  <div class="col-12">
                    You have not saved the changes. Are you sure you want to leave the page?
                  </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" ngbAutofocus class="btn btn-outline-dark" (click)="modal.close('stay')">Stay</button>
            <button type="button" class="btn btn-danger" (click)="modal.close('leave')">Leave</button>
        </div>
    </ng-template>

当我不使用NgbModal代码而仅使用'confirm（..）'时，它可以正常工作->单击“确定”时，我将导航到新路线。 但是当我使用模式对话框并单击“离开”->时，我仍然停留在当前页面上。

有什么想法可以使用'NgbModal.open（..）'并使它像'confirm（）'一样工作吗？

还有什么方法可以使用路由器获取当前和下一个URL？ 在警卫方法中，我想知道用户要去的地方（他的下一个导航目标）。

谢谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）