异步调用后运行指令

Question

我为Angular构建了一个lazyLoad指令。问题是作为图像路径的属性值是通过$ http异步设置的。目前我已经在范围变量上设置了$ watch。我认为这不是正确的方法吗？任何有关如何使其无需观看，超时或类似的工作的建议＆＃34; hackish＆＃34;方法？ ：）

这是指令：

angular.module('lazyLoad',[]).directive('lazyLoad', [function() {

return {
    restrict: 'A',
    scope: {
        imageSrc: '=lazyLoad'
    },
    link: function(scope, el, attrs) {

        scope.$watch('imageSrc', function(nVal, oldVal) {

            if (nVal !== oldVal) {
                if (angular.isDefined(scope.imageSrc)) {

                    var img = new Image();

                    img.onload = function() {

                        if (el[0].nodeName !== 'IMG') {
                            el.css('background-image', 'url('+scope.imageSrc+')');
                        }
                        else {
                            el.attr('src', scope.imageSrc);
                        }

                        if (el.hasClass('lazy')) {
                            el.addClass('lazy-loaded');
                        }
                        else {
                            el.parent().addClass('lazy-loaded');
                        }

                    };

                    img.src = scope.imageSrc;

                }                
            }

        });
    }
};

}]);