在編譯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); 
 
     }); 
 
     } 
 
    }; 
 
    } 
 
]);