How to pass $ event to onEnter function of angular ui router state

I have a question maybe stupid, I am using state ui-router

to open a modal as described here , except the modal part is not ui-bootstrap angular-material $mdDialog

. As some of you know, $ mdDialog slides out of an element that was not pushed top-to-top like bootstrap-modal. Right now it is disappearing without sliding, I would like to move the modal.
I created a fiddle for this purpose .
Here is the code

var app = angular
  .module('myApp', ['ngAnimate', 'ngAria', 'ngMaterial', 'ui.router'])

.config(['$stateProvider', function($stateProvider) {
    $stateProvider
      .state("campaigns", {
        url: "/campaigns",
        abstract: true
      })
      .state("campaigns.add", {
        url: "/add",
        onEnter: function($mdDialog) {
          var ev = null; // this should be the $event 
          $mdDialog.show(
            $mdDialog.alert()
            .parent(angular.element(document.body))
            .title('This is an alert title')
            .content('You can specify some description text in here.')
            .ariaLabel('Alert Dialog Demo')
            .ok('Got it!')
            .targetEvent(ev)
          );
        }
      });
  }])
  .controller('myController', function($scope) {

  });

      

        
        
        
      

    

Html

<div ng-app="myApp" ng-controller="myController"><a ui-sref="campaigns.add">add campaign</a></div>