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