從指令中獲取元素樣式 - 隨機失敗

Question

在一個角度指令中，我想獲得一些樣式（例如：backgroundImage）以供將來使用。我有如下代碼：

angular.module('myApp') 
    .directive('myDirective', function() { 
     return { 
      restrict: 'A', 
      terminal: true, 
      link: function(scope, element, attrs) {         
       // examples of how get it 
       console.log(element.css('background-image')); 
       console.log(window.getComputedStyle(element[0]).backgroundImage); 
      } 
     }; 
    }); 

大多數時候，我得到的和backgroundImage值成功，但timetimes我得到的只是空值。然後我刷新頁面並再次成功獲取該值。我該如何從指令中獲取樣式屬性而不會出現此問題？

任何提示或建議表示讚賞。由於

Answer 1

您可以確保正在讀的CSS一旦所有內容已被等待$viewContentLoaded事件時加載：

angular.module('myApp') 
    .directive('myDirective', function() { 
     return { 
      restrict: 'A', 
      terminal: true, 
      link: function(scope, element, attrs) {         
       scope.$on('$viewContentLoaded', function() { 
        console.log(element.css('background-image')); 
        console.log(window.getComputedStyle(element[0]).backgroundImage); 
       }); 
      } 
     }; 
    });