"Element $" w dyrektywie angularjs jest komentarzem z powodu ng-if

Question

Próbuję utworzyć dyrektywę popup (dialogową) dla mojej aplikacji angularjs. (wciąż dużo todo ...) Jednak zrobiłem plik szablonu, który buduje element popup, z wstawieniem wartości z atrybutów przekazanych z elementem dyrektywy.

Chodzi o to, mam w tym szablonie kilka NG-FI do sprawdzania różnych wartości właściwości w zakresie, potem kątowe wkładki komentarze jak

<!-- ngIf: active --> 

przed i po odpowiednich elementów. Otrzymuję komentarze zamiast rzeczywistego elementu w argumencie $ element w kontrolerze!

Dlaczego nie ma tu miejsca na pomijanie komentarzy? jak mogę to przezwyciężyć?

mój kod szablonu (popup_template.html):

<div class="{{className}}" ng-if="active" style="{{popupStyle}}" ng-keyup="closeByEscape($event)"> 
    <div class="vex-overlay" style="{{overlayStyle}}"></div> 

    <div class="vex-content" style="{{contentStyle}}"> 
     <form class="vex-dialog-form" ng-if="type=='plain'"> 
      <div class="vex-dialog-message" ng-if="message!=null"> 
       {{message}} 
      </div> 
     </form> 
     <div ng-if="type=='advanced'" class="transcluded"> 

     </div> 
     <div class="vex-close" ng-if="showCloseButton" ng-click="close()"></div> 
    </div> 
</div> 

teraz mój kod kątowa:

app.directive('popup', ['popupfactory', '$timeout', function (popupfactory, $timeout) { 
return { 
    restrict: 'E', 
    replace: true, 
    templateUrl: 'popup_template.html', 
    transclude: true, 
    scope: false, 
    link: function (scope, element, attrs, $timeout) { 

     /* Declarations of all scope variables*/ 

     /*** Here, element is a comment! ***/ 

    }, 
    controller: ['$scope', '$element', '$attrs', '$transclude', '$http', function ($scope, $element, $attrs, $transclude, $http) { 

     /*** Here, $element is a comment! ***/ 

    }], 
}; 
}]); 

byłbym bardzo wdzieczny za wszelkie uwagi.

Answer 1

Nie jestem pewien, czy rozumiem problemu całkowicie, ale jeśli chcesz pracować z dyrektywami dotyczącymi tych elementów polecam korzystania ng-show i ng-hide zamiast ng-if, jak ta ostatnia może naprawdę Śruba z jakichkolwiek programów obsługi zdarzeń poprzez zastosowanie ty dyrektywy.

Z ng-if węzeł jest dodawane i usuwane z DOM (stąd Chyba włożonej jak komentarzu do swojego dyrektywy) podczas ng-show i ng-hide prostu zrobić węzeł niewidoczne przez stylizacji, zachowując wszelkie koparki żywy i pozwala manipulować treść z łatwością.