Cordova

Question

我正在开发一个应用程序，我已经在每个页面的页眉中添加了一个后退图标。但我需要使用设备后退按钮实现相同的功能。每个页面都使用一些我无法在 util.js 服务中访问的参数进行路由。

1. app.component.ts

ngOnInit() {
    document.addEventListener('deviceready', (evt) => this.onDeviceReady(evt), false);
    document.addEventListener('resume', (evt) => this.onResumeCall(evt), false);
    document.addEventListener('offline', this.inOfflineMode, false);
    document.addEventListener('online', this.inOnlineMode, false);
    document.addEventListener('backbutton', (evt) => this.onBackKeyDown(evt), false);
    this._config.init();
    this.analyticsService.updateAppOpenCount();
  }

在这里我可以使用在另一个服务文件中实现的功能注册后退按钮事件。

2。 util.js

public deviceBackButton(): void {
        if (window.cordova) {
            if (window.location.hash === '#/') {
               // window.history.back();
               navigator.app.backHistory();
                navigator.app.exitApp();
            } else {
                window.history.back();
            }
        }

    }

这是一个后退按钮处理函数，在 util.js 中实现，它只是服务。我无法在此服务中注入组件。

我们是否有任何其他解决方法，以便我们可以使用 cordova 和 angular 4/6 在任何组件或页面中重写此后退按钮处理程序？

目前我可以从第一页返回，但从第二页开始应用程序视图变得糟糕。

Answer 1

我还没有在 angular、cordova 中做过这样的事情。但我已经这样做了。我已经搜索了这个 cordova 我找到了这个。当用户按下设备后退按钮时 "backbutton" 事件被触发尝试为此添加一个事件侦听器。

document.addEventListener("backbutton", yourCallbackFunction, false);

yourCallbackFunction 将在用户按下设备后退按钮时触发。 https://cordova.apache.org/docs/en/1.6.0/cordova/events/events.backbutton.html

Answer 2

我已经使用 HostListener 解决了问题...

我是按照下面的方式做的...

在您的控制器中实现以下方法。

@HostListener('window:popstate') backbuttonpressed() {
    console.log('back button pressed');
  }

要使用 HostListener，您必须先导入它。

import { HostListener } from '@angular/core'

Cordova - Angular 4- 有什么方法可以重写 android 设备后退按钮

Cordova - Angular 4- Is there any way to re-write android device back button

android

cordova-plugins

angular

angular6