ionic 4 in the key operation to return the listener

Before long before done such a return key, exit this operation returns when there is the interface to exit this screen when there is no operation, double-click on the main interface returns an exit, before seen a lot of articles, and finally found in the ionic4 Some code has not used his own tinkering done such an operation, code app.component.ts code

import { Component } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { Platform, NavController } from '@ionic/angular';
import { Toast } from '@ionic-native/toast/ngx';
import { AppMinimize } from '@ionic-native/app-minimize/ngx';
import { Subscription } from 'rxjs';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { ServicesService } from './services.service'

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  providers: [AppMinimize]
})

export class AppComponent {
  sideMenuDisabled = true;
  backButtonPressed : Boolean = to false ; // for determining whether to exit 
  customBackActionSubscription: Subscription;
  URL : the any = '/ tabs / index'; // URL original interface

  constructor(
    private platform: Platform,
    private router: Router,
    public navController: NavController,//导航控制器
    public toast: Toast,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar,
    public serve: ServicesService
  )
  // above all inject your own search injected 
  {
    this.initializeApp();
    this.initRouterListen();
    this.platform.ready().then(() => {
      the this .statusBar.styleDefault (); // manage the appearance of the machine status bar, styleDefault the default status bar (dark text, light background). 
      this.statusBar.hide (); // show and hide the splash screen. 
      this.registerBackButtonAction (); // register key event returns 
      the this. keyboardEvent ();
      the this .platform.resume.subscribe (); // pop-up 
    });
  }

  Private the keyValue: = the any to false ; // determines whether the return to the interface 
  registerBackButtonAction () {
    let that = this;
    this.customBackActionSubscription = this.platform.backButton.subscribe(() => {
      if (that.keyValue) {
        that .keyValue = to false ; // trigger return key operation is true when the interface is not a return to the 
        return ;
      }
      IF (this.serve.get ( "Scan")) {this.serve.set ( "Scan", to false ); return ;} // here pass value for the service 
      IF (that.url === '/ tabs / index ') { // determines whether the initial interface 
        iF (that. backButtonPressed) {
          navigator['app'].exitApp();
          that.backButtonPressed = false;//退出
        } else {
          the this .toast.show ( 'press again to exit the application', '1500', 'Top'). the Subscribe (
            toast => {
              console.log(toast);
            }
          );
          that.backButtonPressed = true;
          the setTimeout (() => = that.backButtonPressed to false , 1500); // delay change is determined to exit the attribute 
        }
      } else {
        that .navController.back (); // return to the interface 
      }
    });
  }
  initializeApp() {
    this.platform.ready().then(() => {
      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });
  }
  keyboardEvent () { // keyboard triggers 
    the let = that the this;
    window.addEventListener('native.keyboardshow', function () {
      that .keyValue = to true ; // keyboard turn change the attributes 
    });
    window.addEventListener('native.keyboardhide', function () {
      the setTimeout (() => = {that.keyValue to false ;}, 200 is) // delay 
    });
  }
  init router listen () {
    the this .router.events.subscribe (Event => { // need to get the current into the final interface performs a URL 
      IF (Event the instanceof NavigationEnd) {
        this.url = event.url;
      }
    });
  }
}

 

We hope to help you avoid detours