要避免在一个缓慢的平台丑陋的屏幕重绘，我试图从任何指令或控制器时，所有图像渲染到检测事件（而不仅仅是加载）。我还没有设法找到一个合适的事件。

我想我可以等待'$ viewContentLoaded事件，然后触发$超时的任意时间后激活NG-节目，但是这显然哈克。有没有更好的解决办法？

  .directive（'myDirective'，['$窗口'，功能（$窗口）{    返回{        链接：功能（$范围，$元，$ ATTR）{            $范围。在（'$ viewContentLoaded'，函数（事件）{$                警报（'$ viewContentLoaded！）                $超时（函数（）{                    // 展示内容                }，1000）;            }）;    }}]）; 

解决方案

这是我用一个简化版本

假设你有角一起使用jQuery：

  app.directive（'imagesLoaded'，[功能（）{  返回{    限制：'A'，    链接：功能（范围，元素，ATTRS）{      变量$ IMG = element.find（IMG），          数= $ img.length，          I = 0;      如果（计数=== 0）回报;      $ img.one（加载，函数（）{        我++;        如果（I＆GT; =计数）{          范围$广播（'images.loaded'）。        }      }）;      $ img.each（函数（）{        如果（this.complete）{          $（本）.load（）; //需要缓存图像        }      }）;    }  };}]）; 

To avoid ugly screen redraw on a slow platform, I'm attempting to detect an event when all images have rendered (rather than just loaded) from either a directive or a controller. I haven't managed to find an appropriate event.

I guess I could wait for the '$viewContentLoaded' event and then trigger a $timeout to activate ng-show after an arbitrary period of time but that's clearly hacky. Is there a better solution?

.directive ( 'myDirective', ['$window',

function ( $window ) {

    return {

        link: function ( $scope, $element, $attr ) {

            $scope.$on('$viewContentLoaded', function(event){
                alert ('$viewContentLoaded!')
                $timeout(function () {
                    // show content
                },1000);

            });
    }
}
]);

This is a simplified version of what I use

Assuming you use jquery along with angular:

app.directive('imagesLoaded',[function(){
  return {
    restrict: 'A',
    link: function(scope, element, attrs) {
      var $img = element.find("img"),
          count = $img.length,
          i = 0;

      if( count === 0) return;

      $img.one("load", function(){
        i++;
        if (i >= count) {
          scope.$broadcast('images.loaded');
        }
      });

      $img.each(function(){
        if (this.complete) {
          $(this).load(); // needed for cached images
        }
      });
    }
  };
}]);