Странное поведение ngDirectives внутри пользовательских директив

Question

Я написал эту директиву:

app.directive('vvPopover', function($templateCache, $compile){ 
    return{ 
     link:function(scope, elem, attrs){ 
      elem.click(function(){ 
       $(this).parent().append($compile($templateCache.get('notificationPanel'))(scope)); 

      });  
     } 
    } 
}); 

Что взять этот шаблон:

<script type="text/ng-template" id="notificationPanel"> 
    <div class="ss-popover" ng-show="false"> 
     <div>Notifiche</div> 
     <ol> 
      <li ng-repeat="notif in [0,1,2]">{{notif}}</li> 
     </ol> 
    </div> 
</script> 

И положить его в этом HTML:

<li class="headerCampaign"> 
     <button class="icon-bell" vv-popover></button> 
</li> 

Результат , как видно через Хром:

<li class="headerCampaign"> 
     <button class="icon-bell" vv-popover=""></button> 
     <div class="ss-popover ng-binding ng-scope" ng-show="false"> 
      <div>Notifiche</div> 
      <ol> 
      <!-- ngRepeat: notif in [0,1,2] --> 
      </ol> 
     </div> 
</li> 

Как вы можете видеть, директива ng-show не подвержена угловому воздействию. Ng-repeat скомпилирован, но не выполняет итерацию по массиву.

Любое объяснение этой странности?

Answer 1

вызова scope.$apply() внутри функции мыши