相关疑难解决方法(0)

Angular2:使用浏览器返回事件关闭ng-bootstrap模式

我的Angular2应用程序使用ng-bootstrap模式来详细显示一些结果图表.出于这个原因,我将模态调整为几乎全屏(仅margin: 20px左侧).这会导致某些用户使用浏览器后退按钮而不是页面右上角或底部的关闭按钮.

我现在正在尝试取消默认的浏览器返回事件,并在调用事件时关闭模式.

我在这里使用一些代码作为代码库来监听浏览器事件并用一些东西扩展它:

import { PlatformLocation } from '@angular/common'

(...)

modalRef: NgbModalRef;

constructor(location: PlatformLocation) {

    location.onPopState(() => {

        console.log('pressed back!');

        // example for a simple check if modal is opened
        if(this.modalRef !== undefined) 
        {
            console.log('modal is opened - cancel default browser event and close modal');
            // TODO: cancel the default event

            // close modal
            this.modalRef.close();
        } 
        else 
        {
            console.log('modal is not opened - default browser event');
        }
    });
}

(...)
// some code …
Run Code Online (Sandbox Code Playgroud)

ng-bootstrap angular

11
推荐指数
1
解决办法
4724
查看次数

如何使用浏览器的后退按钮关闭引导模式,而不是返回页面?

我发现此问题与智能手机有关,并且可能与台式机有关。我们已经“修改”了引导模式以进行响应,但是当在智能手机上以全屏显示时,用户会认为该模式是页面,然后单击以“关闭”它。我们已经在右上方的X中添加了,但是还希望使用后退按钮来关闭模式。有人有想法么?

谢谢

jquery jquery-ui modal-dialog twitter-bootstrap

2
推荐指数
2
解决办法
9201
查看次数