using ionic gesture doubletab to navigate a page

I'm trying to navigate in Ionic Framework with double-click to the login page. Gesture is detected but will not navigate to the page. What is wrong with the code?

Controller and directive:

myApp.controller('gestureCtrl', function($scope, $timeout) {

  $scope.data = {
    swipe : 0,
    swiperight: 0,
    swipeleft: 0,
    tap : 0,
    doubletap : 0,
    scroll : 0
  };

  $scope.reportEvent = function(event)  {
    console.log('Reporting : ' + event.type);

    $timeout(function() {
      $scope.data[event.type]++;
    })
  }


})

myApp.directive('detectGestures', function($ionicGesture, $location) {
  return {
    restrict :  'A',

    link : function(scope, elem, attrs) {
      var gestureType = attrs.gestureType;

      switch(gestureType) {
        case 'doubletap':
          $ionicGesture.on('doubletap', scope.reportEvent, elem);
          //window.navigate("loginPage.html");
          $location.url('/loginPage');
          break;
      }

    }
  }
})

HTML:

<div ng-controller="gestureCtrl" id="south" detect-gestures gesture-type="doubletap" class="col swipe-box">
            <p>
                Double Tap Me to navigate the login page
                {{data.doubletap}}
            </p>
        </div>