Popover not showing

I am getting the following error when trying to open a popover from my directive . I know this error has been reported already but after trying various suggestions, I am still not able to resolve the issue.
am I missing anything?

angular.directiive('dir [

 '$ionicPopover',
 '$compile',
function(
  $ionicPopover,
  $compile
) {
 return {
   restrict : E',
   template :  '<ion-nav-bar>'
                      + '<ion-nav-title>'
                      +  '<a ng-click="togglePopover($event)" class="title"> test</a>'
                      + '</ion-nav-title>'
                      +'</ion-nav-bar>',

link : function(scope){
      var popover_template = '<ion-popover-view style="height: 35px">'
          + '<ion-content><h2>Hello</h2></ion-content></ion-popover-view>';
       
     scope.popover = $ionicPopover.fromTemplate(popover_template, {
                 scope : scope
            });
    scope.togglePopover = function(e) {
               scope.popover.show(e);
           };
  }

};
])

I just fixed the issue