Wyłączyć przycisk hardware back w aplikacji Ionic?

Próbuję Wyłączyć przycisk Wstecz w mojej aplikacji Cordova. Używam AngularJS + Ionic Framework. Znalazłem tematy na ten temat i wypróbowałem poniższy kod, ale nie ma absolutnie żadnego efektu. Jakiś pomysł? Dzięki!

Indeks.html 

<head>
    <script>
      document.addEventListener("deviceready", onDeviceReady, false);
        function onDeviceReady() {
            document.addEventListener("backbutton", function (e) {
                e.preventDefault();
                console.log("hello");
            }, false );
        }
    </script>
</head>

Zauważ, że po naciśnięciu przycisku Wstecz w konsoli wyświetlane jest "hello".

Author: David D., 2014-10-24
Source

8 answers

Wreszcie znalazłem odpowiedź na ten Ionic wątek na Forum: 

$ionicPlatform.registerBackButtonAction(function () {
  if (condition) {
    navigator.app.exitApp();
  } else {
    handle back action!
  }
}, 100);

$ionicPlatform.registerBackButtonAction pozwala całkowicie nadpisać zachowanie przycisku Wstecz. Pierwszy param jest funkcja callback, a drugi priorytet (tylko wywołanie zwrotne z najwyższym priorytetem zostanie wykonane).

 36
Author: David D.,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-02-16 15:08:47 
$ionicPlatform.registerBackButtonAction(function (event) {
    event.preventDefault();
}, 100);

Spowoduje to zablokowanie funkcji przycisku Wstecz.

 21
Author: Muhammad Faizan Khan,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-02-16 15:08:59

Aby rozszerzyć odpowiedź Davida D, włączyłem implementację go back.

Umieść to w swoich aplikacjach .run Funkcja: 

$ionicPlatform.registerBackButtonAction(function (event) {
  if ($ionicHistory.currentStateName() === 'someStateName'){
    event.preventDefault();
  } else {
    $ionicHistory.goBack();
  }
}, 100);

To nie będzie działać w kontrolerach, jest to cała aplikacja.

 12
Author: Weston Ganger,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-05-06 15:39:53

Its simple trick prevent go back to single page: 

  `.controller('DashCtrl', function($scope,$ionicHistory) {
                $ionicHistory.clearCache();
                $ionicHistory.clearHistory();

       })`
 4
Author: Niv Kapade,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-08-25 14:16:53

Przykład w docs pokazuje detektory zdarzeń - nawet deviceready - dołączone po wywołaniu zdarzenia document onload.

Użycie kodu: 

function onDeviceReady() {
  document.addEventListener("backbutton", function (e) {
    e.preventDefault();
    console.log("hello");
  }, false);
}

document.onload = function () {
  document.addEventListener("deviceready", onDeviceReady, false);
};
 2
Author: Tautologistics,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-10-24 13:26:09

Aby uniemożliwić korzystanie z funkcji przycisku Wstecz urządzenia, 

      $ionicPlatform.registerBackButtonAction(function (event) {
           event.preventDefault();
      }, 100);

Jeśli chcesz zapobiec użyciu konkretnej strony, 

       $ionicPlatform.registerBackButtonAction(function (event) {
           event.preventDefault();
           if ($location.path() === "/pagename" || $location.path() === "pagename") {
             navigator.app.exitApp();
           } else {
             $ionicHistory.goBack();
           }
        }, 100);
 2
Author: S.M.Priya,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-11-02 09:24:48

Aby wyłączyć hardware back button W aplikacji Ionic dla kontrolera (lub kontrolera komponentu), możesz wykonać następujące obejście, ale najpierw nie jest to w rzeczywistości dla samego kontrolera, ale kombinacja kontrolerów i stanu, w kontrolerze dodaj swój normalny kod: 

  var deRegisterHardBack = $ionicPlatform.registerBackButtonAction(
      function (event) {
        if (youConditionHere) {
          event.preventDefault();
          // do something
        } else {
          $ionicHistory.goBack();
        }
      }, 100);

Ale w Twoim $stateProvider dodaj disableHardwareBackButton Jak poniżej: 

$stateProvider
      .state('app.stateB', {
        url: '/page-b/:id',
        template: '<ion-view><ion-nav-title>Sub Page </ion-nav-title>Hello</ion-view>',
        disableHardwareBackButton : true
      });

Wewnątrz modułu ('app').funkcja run: 

$ionicPlatform.registerBackButtonAction(function(event){
   if ($state.current.disableHardwareBackButton){
      event.preventDefault();
   } else {
      $ionicHistory.goBack();
   }
}

W ten sposób można obejść problem z "sub section" lub " inside controller "

 0
Author: Al-Mothafar,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-11-27 09:54:31

Dla Jonowych 3:

// root component
export class MyApp {

  constructor(platform: Platform) {
    platform.ready().then(() => {
      platform.registerBackButtonAction(() => {
        this.customBackButtonHandler();
      }, 100)
    });
  }

  customBackButtonHandler() {
    ...
  }

}
 0
Author: Prashant Ghimire,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-04-16 18:30:36