在编译angularJS之后是否可以加载自定义指令？

Question

我有这个指令来计算divs的高度。

// Directive to log a height. We have to add on some value to a final height, because css style will be undefined. 
rootApp.directive('logHeightCategories', ['$timeout', function($timeout) { 
    return { 
     restrict: 'A', 
     link: function(scope, element) { 
      scope.prepMaxHeightCat = element.prop('offsetHeight'); 
      scope.value = 0; 
      $timeout(function() { 
       scope.maxHeightCat = scope.value + scope.prepMaxHeightCat; 
      }, 0); 
     } 
    }; 
}]); 

的CSS规则max-height: {{maxHeightCat}}px被应用到该div动画目的。然而，闪烁效应破坏了欲望目标。所以我已经为该div添加了ng-cloak到display:none。

我认为ng-cloak被渲染为最后，因此我认为我的指令logHeightCategories之前执行。所以我总是得到0px的结果。

...即使我已经添加了一个$timeout函数，希望我能克服执行时间，但我认为情况并非如此。

Answer 1

您可以尝试

rootApp.directive('logHeightCategories', ['$timeout', '$compile', 
 
    function($timeout,$compile) { 
 
    return { 
 
     restrict: 'A', 
 
     link: function(scope, element, attrs) { 
 
     scope.prepMaxHeightCat = element.prop('offsetHeight'); 
 
     scope.value = 0; 
 
     scope.maxHeightCat = scope.value + scope.prepMaxHeightCat;  
 
     scope.$watch(attrs.logHeightCategories, function(html) { 
 
      element.html(html); 
 
      $compile(element.contents())(scope); 
 
     }); 
 
     } 
 
    }; 
 
    } 
 
]);