Aniket Bhange Aniket Bhange - 5 months ago 60
AngularJS Question

in ionic on registering onHardwareBackButton event the back button still make page to navigate previous page

I am new to ionic. I am using onHardwareBackButton event of ionic, the event is working correct it is taking me to register function but after going to register function it is still navigating to back page.
I am showing cordova confirm dilogbox on hardwarebackbutton event function so after clicking on cancle he can navigate to back page, but now the popup is also coming and page is also navigating back same time.I have searched and tried many code like

e.preventDefault()

e.stopPropagation()


both of them are not workign
I have tried registerBackButtonAction event also but it is not getting deregister when i leave page.
I am stuck with this problem from many hours.
The code which I am using is given below..

//this is register event i have used

showalertPopup = function(){
//showing popup
}

$scope.$on '$ionicView.enter', (event, view)->
$ionicPlatform.registerBackButtonAction showalertPopup, 100

//like this i am diregistering event
$scope.$on '$ionicView.leave', (event, view)->
$ionicPlatform.offHardwareBackButton showalertPopup


in place of registerBackButtonAction i have used onHardwareBackButton

Answer

What you can do here is registerBackButtonAction with priority 100 (see docs):

The priorities for the existing back button hooks are as follows:
Return to previous view = 100
Close side menu = 150
Dismiss modal = 200
Close action sheet = 300
Dismiss popup = 400
Dismiss loading overlay = 500

so, basically, you're overriding the "Return to previous view" action.
You're going to need a handler to de-register when you're leaving the view:

var backbuttonRegistration = null;

$scope.$on('$ionicView.enter', function(event, viewData) {
    backbuttonRegistration = $ionicPlatform.registerBackButtonAction(function(e) {
            e.preventDefault();
            showalertPopup();
        }, 100);
});

$scope.$on('$ionicView.leave', function(event, viewData) {
    if (backbuttonRegistration)
    {
        backbuttonRegistration();
    }
});

According to the documentation, registerBackButtonAction :

Returns: A function that, when called, will deregister this backButtonAction.

Your controller should look something like this:

  .controller('homeController', function($scope, $ionicPopup, $ionicPlatform) {

    function showalertPopup() {
      var alertPopup = $ionicPopup.alert({
        title: 'Don\'t eat that!',
        template: 'It might taste good'
      });
      alertPopup.then(function(res) {
        console.log('Thank you for not eating my delicious ice cream cone');
      });
    }

    var backbuttonRegistration = null;

    $scope.$on('$ionicView.enter', function(event, viewData) {
        backbuttonRegistration = $ionicPlatform.registerBackButtonAction(function(e) {
                e.preventDefault();
                showalertPopup();
            }, 100);
    });

    $scope.$on('$ionicView.leave', function(event, viewData) {
        if (backbuttonRegistration)
        {
            backbuttonRegistration();
        }
    });

});

PS:

You can registerBackButtonAction with the highest priority of all - let's say 1000 - and it will work:

    backbuttonRegistration = $ionicPlatform.registerBackButtonAction(function(e) {
            e.preventDefault();
            showalertPopup();
        }, 1000);
Comments