событие click в угловом для детей с переходом

Question

Я пытаюсь запустить событие click на дочернем элементе transcluded в моей директиве. Он не работает. По какой-то причине я, кажется, потерял доступ к родительскому объекту.

app.controller('myController', [ 
    '$scope', 
    '$log', 
    '$q', 
    function ($scope, $log) { 
     $scope.delete = function(){ 
     $log.log('delete clicked'); 
     }; 

     $scope.whatever = function(){ 
     $log.log('whatever clicked'); 
     }; 
    } 
    ]); 


    <!-- directive markup --> 
    <span class="ui-menu-action"> 
    <span class="trigger" ng-click="showMenu = !showMenu"> 
     <i class="sl-icon sl-icon-box-arrow-down"></i> 
    </span> 
    <div class="actions" ng-show="showMenu" ng-mouseenter="cancelHide()"></div> 
    </span> 


    <!-- calling the directive --> 
    <ui-menu-action> 
     <ul> 
     <li><a href ng-click="delete()">Delete</a></li> 
     <li><a href ng-click="whatever()">Whatever</a></li> 
     </ul> 
    </ui-menu-action> 


    app.directive('UiMenuAction', [ 
    '$http', 
    '$tooltip', 
    '$log', 
    '$rootScope', 
    '$timeout', function($http, $tooltip, $log, $rootScope, $timeout){ 
     return { 
     restrict: 'E', 
     replace: true, 
     //scope: {}, 
     transclude: true, 
     templateUrl: './scripts/modules/ui/templates/ui.menu.action.html', 
     link: function(scope, element, attrs, ctrl, transclude){ 
      var to; 
      scope.showMenu = false; 
      scope.hideOnPageClick = attrs.hideonpageclick; 

      $rootScope.$on('pageClick', function(e, $event){ 
      var isMenuClick = !!$($event.target).parents('.ui-menu-action').length; 

      if (scope.hideOnPageClick && !isMenuClick) { 
       scope.showMenu = false; 
      } 
      }); 

      scope.hideMenu = function(){ 
      if (scope.hideOnPageClick) return; 

      to = $timeout(function(){ 
       scope.showMenu = false; 
      }, 400); 
      }; 

      scope.cancelHide = function(){ 
      if (scope.hideOnPageClick) return; 

      if (to) { 
       $timeout.cancel(to); 
      } 
      }; 

      transclude(scope.$parent, function(clone, scope) { 
      element.find('.actions').append(clone); 
      }); 
     } 
     }; 
    }]); 

Answer 1

почему не вы просто удалить

 transclude(scope.$parent, function(clone, scope) { 
     element.find('.actions').append(clone); 
     }); 

И добавить нг-transclude к разметке

<div class="actions" ng-transclude ng-show="showMenu" ng-mouseenter="cancelHide()"></div>