通过后退按钮关闭 Ionic 4 中的模态框

2024-02-03

我有一个Modal in Ionic 4。我想close它,当用户按下返回键在她的手机上(或浏览器中的后退按钮)。

有谁知道我该怎么做?

编辑:更多细节:

我有一个打开模式的按钮:

async onClick() {
  const modal = await this.modalController.create({
    component: Foo,
  });
  return await modal.present();
}

成分Foo没有比关闭模式的按钮更多的内容:this.modalController.dismiss();。到目前为止,一切都很好。

然而,在我的手机上,当模式打开并且用户点击手机的后退按钮时,应用程序现在会关闭。但在这种情况下,只有模式应该关闭。


Enol 的回答帮助我找到了解决方案,谢谢。

platform.registerBackButtonActionv4 中不再存在。我试过platform.backButton.subscribe相反,但它不起作用。有效的是这样的:

private backbuttonSubscription: Subscription;

constructor(private modalCtrl: ModalController) {

ngOnInit() {
    const event = fromEvent(document, 'backbutton');
    this.backbuttonSubscription = event.subscribe(async () => {
        const modal = await this.modalCtrl.getTop();
        if (modal) {
            modal.dismiss();
        }
    });
}

ngOnDestroy() {
    this.backbuttonSubscription.unsubscribe();
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

通过后退按钮关闭 Ionic 4 中的模态框 的相关文章

  • 如何将值参数传递给 Bootstrap 中的 modal.show() 函数

    我有一个页面显示当地咖啡馆的列表 当用户单击某个咖啡馆时 会显示一个模式对话框 其中已预先填写了 咖啡馆名称 该页面包含许多咖啡馆名称 表单应包含他点击的 咖啡馆名称 以下是生成为带有链接按钮的文本的咖啡馆名称列表 table class
  • C# OpenFileDialog 非模态可能

    是否可以创建 拥有非模式 net OpenFileDialog 我在主对话框中有一个 UI 元素 始终需要可供用户按下 No 打开文件对话框 http msdn microsoft com en us library system wind
  • AngularJS - 将外部 html 文件包含到模态中

    我正在使用 AngularJS 并且有一个 html 页面 其中包含多个引导模式 这个 html 文件由于包含了所有这些模态而变得有点繁重 是否可以在不失去范围的情况下将外部 html 文件包含到这些模态中 如果您使用 Angular UI
  • django表单提交后触发引导模式

    提交 django 表单后如何触发弹出引导模式 在我的 index html 模板中 我有一个像这样的标准外观模式 div class modal fade div class modal dialog div class modal co
  • Ionic 4 键盘覆盖输入字段

    我有一个 Ionic 4 应用程序 其中有一个包含输入的表单 当用户单击输入时 它会打开键盘 但会隐藏内容 而不滚动 有没有办法解决 这是我的代码
  • Twitter bootstrap 远程模式每次都显示相同的内容

    我正在使用 Twitter bootstrap 我已经指定了一个模式 div class modal hide div class modal header div div
  • Jframe 内有 2 个 Jdialogs 的 setModal 问题

    当我设置第一个选项时 我遇到了问题JDialog模态 第二个非模态 这是我正在尝试实现的功能 单击 测试对话框 按钮 一个JDialog有名字自定义对话框 主要的将会打开 如果单击 是 选项自定义对话框主 其他JDialog named 自
  • Angular 模态对话框最佳实践

    与不具有动态内容的对话框相比 创建具有动态内容的模式对话框的最佳实践是什么 例如 我们有一些模式表单接受表单元素列表 并具有提交 取消功能 此外 还有一些模式对话框仅显示确认 确定类型的操作 我见过很多人说对话框应该是传递到控制器的服务 但
  • 模态中的引导模态

    如何使用 Jquery 在另一个模态中构建引导模态 第一个模态应该在后台 当我参考引导文档时 发现一次显示多个模式需要自定义代码 任何想法 您可能想尝试 Bootstrap Modal 插件 此处演示 可堆叠 http jschr gith
  • Primefaces 对话框渲染两次

    我创建了一个 ui component 来像弹出窗口一样使用 因此我可以使用此模板的标准创建很多弹出窗口 该组件只是一个带有两个按钮 取消和提交 的弹出窗口和一个可以覆盖的内容 如下所示
  • 如何使用showModal按照承诺完全屏蔽外部内容?

    我正在尝试修改页面行为javascript 书签 因为我无法在当前环境中制作插件 或几乎其他任何东西 几乎一切都工作正常 除了某些页面中预期的输入键 其中包含某种全局捕获 发生的事情是这样的 function window dialog d
  • Dojo“正在加载”消息

    我是 Dojo 新手 所以我需要一些帮助 我的一些链接需要一段时间 当用户单击时 页面开始加载需要几秒钟 我想添加一条 正在加载 消息 我可以用 旧时尚方式 来做 但我想学习新的 更简单 更智能的 Dojo 方式 具体如何工作现在并不重要
  • 从 Ionic 4 警报中的输入获取价值

    截至今天 Ionic 4 文档离子警报 https ionicframework com docs api alert包含如何将文本输入添加到警报的示例 如下所示 const alert await this alertController
  • 在 ASP.NET MVC 中使用 bootstrap 创建模式

    我在 ASP NET MVC 项目上使用 NET Framework 4 5 Bootstrap v3 3 6 我想做的是创建一个模态表单 我尝试了以下方法 在主布局中创建了一个模态容器 div class modal fade style
  • 禁用向下拖动以关闭 showModalBottomSheet

    如何在底部表单模态中禁用 转义向下拖动手势 以便用户可以在模态中进行交互而不会意外关闭模态 下面用实际的模态底部表进行了更新 return showModalBottomSheet context context builder Build
  • REACT NATIVE - 关闭导入模式时更改屏幕状态

    当我关闭模式时 我需要检测它是否已关闭以更改父页面的状态 当我更改状态的任何属性 模态 时无法更改它 ExpertFeedback js import ModalExpertFeedback from ModalExpertFeedback
  • 在 Bootstrap 模式窗口中打开远程内容

    我所需要的只是一个简单的示例 说明如何将远程内容打开到 Twitter Bootstrap 模式窗口中 我正在使用 Bootstrap v2 0 4 但我无法让它工作 我可以打开常规模式窗口 但无法让它打开其中的远程文件 首先 远程数据必须
  • Angular 2 insideHTML 忽略表单标签

    我正在为 Angular 2 构建一个模态 因为没有像 Angular 1 x 这样的原生模态 而且我取得了很好的进展 我创建了一个模态组件 可以显示和隐藏 并且有一个主体输入唯一不起作用的是 由于某种原因 表单元素被从渲染的 html 中
  • 如何使用数据表在按钮单击时显示带有列数据的确认模态

    有了下面的数据表 我想在单击按钮时显示动态弹出窗口或模式 这将用作确认模式 The modal should contain data coming from the columns in the respected row in whic
  • 从父组件调用的子组件内的 Angular 2 ng2-bootstrap 模式

    很难解释这一点 我有一个简单的 ng2 bootstrap 模式示例 我将其扩展为包含主页的 Boostrap 4 Jumbotron 示例模板 现在 ng2 bootstrap 模式不执行任何操作 我可以看到this childModal

随机推荐

  • 使用 tls-extra 进行简单的 smtp

    我正在尝试编写一个简单的脚本来通过我的 Gmail 帐户发送邮件 但我是初学者 所以事情没那么简单 我尝试了谷歌 但除了 hackage 根本没有任何帮助或示例 问题是我没有找到使用 tls extra 或 tls 来启动 STARTTLS
  • Django OS X 错误的 JPEG 库版本:库是 80,调用者期望 62 sorl.thumbnail

    我在 Mac 上本地使用 sorl thumbnail for django 并且在使用 PIL 时遇到了问题 但今天我终于成功安装了它 libjpeg 遇到了一些问题 我现在可以上传和使用图像 但我无法使用 sorl thumbnail
  • HTTP 下载非常大的文件

    我正在使用 Python Twisted 开发 Web 应用程序 我希望用户能够下载非常大的文件 gt 100 Mb 当然 我不想加载 服务器 内存中的所有文件 服务器端我有这个想法 request setHeader Content Ty
  • 将字符串添加到 List 列表

    我是 C 新手 我需要执行以下操作 我需要声明一个列表 List
  • 在nodejs工作线程内调用函数

    这是我的工人 const Worker require worker threads const worker new Worker function hello console log hello world eval true work
  • Apache tomcat7 作为 Windows 服务

    我正在尝试为 Apache tomcat 7 0 45 创建 Windows 服务 在 Windows 版本 7 中 我执行了这个 C tomcat7 bin gt service install Mytomcat7 Windows 服务已
  • 处理阻塞 .NET 套接字的超时

    使用 Accept 方法创建的 TcpClient 实例用于管理客户端连接 当我需要终止服务器线程时就会出现问题 因为它在接收调用时被阻塞 所以我设置了一个 TcpClient ReceiveTimeout 以便循环每个n毫秒来测试退出条件
  • 如何用python创建0年的日期时间对象

    正如标题所说 如果我尝试这样做 它会给我一个年份值的 ValueError 但我想要一个年份为 0 的日期时间 有什么方法可以做到这一点吗 从文档 datetime 模块导出以下常量 datetime MINYEAR 日期或中允许的最小年份
  • 使用 Office365 SMTP 设置 PHPMailer

    我正在尝试设置 PHPMailer 以便我们的一位客户能够从他们自己的帐户自动生成电子邮件 我登录了他们的Office 365帐户 发现PHPMailer所需的设置是 Host smtp office365 com Port 587 Aut
  • Doctrine 2.3 实体生成器:样本、文档?

    Doctrine 可以基于小数据输入生成实体 包括关系信息 但是 我未能找到有关该主题的任何示例或简明信息 官方文档只有一小段 有一个小的命令行示例 完全没有解释什么 任何人都可以参考这方面的书籍 文章甚至代码示例吗 首先你需要引导程序Do
  • 当键盘存在时,如何使 UITextField 向上移动 - 开始编辑?

    使用 iOS SDK 我有一个UIView with UITextField调出键盘 我需要它能够 允许滚动内容UIScrollView键盘打开后即可查看其他文本字段 自动 跳跃 通过向上滚动 或缩短 我知道我需要一个UIScrollVie
  • iPhone 开发 - 开发和分发配置之间有什么区别?

    我无法在苹果文档中找到关于两者之间区别的明确解释发展 and 分配供应 我目前正在使用开发配置在我的 iPhone 上进行开发和测试 我打算将该应用程序分发到我的 Beta 测试中 我想知道 我需要使用吗分配供应 我应该为每个单独的测试人员
  • Android:获取列中的最高值

    我有一个指向内容的 URL 我需要获取其中一列中包含的最高值 是否有任何聚合函数可以完成该任务 或者我必须手动执行此操作 如果您正在查询 Android 内容提供商 您应该能够通过传递来实现此目的MAX COLUMN NAME 进入选择参数
  • 运行脚本标签是否会阻止其他脚本标签的下载?

    这是来自索引 html in HTML5 样板 https github com h5bp html5 boilerplate blob master index html 就在之前 tag
  • 如何在 C++ 中使用带有用户输入的枚举

    我正在制作一个简单的剪刀石头布游戏 我需要使用枚举数据结构 我的问题是 由于从 int userInput 到 Throws userThrow 的转换无效 我无法编译以下代码 enum Throws R P S int userInput
  • 如何启用 Qt5 中已弃用的功能

    我想将 Qt4 程序移植到 Qt5 并且某些函数未定义 例如 QHeaderView setMoveable 但我在 qheaderview h 文件中看到 通过一些神奇的定义 QT DEPRECATED SINCE 应该可以重新启用它们
  • 如何检查一个句柄是否应该关闭?

    如果 ShellExecuteEx 返回 false 是否应该关闭句柄 function EditAndWait const AFileName string boolean var Info TShellExecuteInfo begin
  • UILocalNotification 在 iOS 10 中已弃用

    这可能是一个提前的问题 但我想知道用什么代替UILocalNotification在 iOS 10 中 我正在开发一个具有部署目标 iOS 8 的应用程序 所以可以使用吗UILocalNotification 是的 您可以使用UILocal
  • 如何在线程中使用notifyDataSetChanged()

    我创建一个线程来更新我的数据并尝试这样做notifyDataSetChanged在我的列表视图中 private class ReceiverThread extends Thread Override public void run up
  • 通过后退按钮关闭 Ionic 4 中的模态框

    我有一个Modal in Ionic 4 我想close它 当用户按下返回键在她的手机上 或浏览器中的后退按钮 有谁知道我该怎么做 编辑 更多细节 我有一个打开模式的按钮 async onClick const modal await th