Question

我怎样才能在AngularJS中等待并显示默认图像，直到该指令更新真实图像（仍处于加载状态）。

我需要每秒检查一次图像而不是仅加载

Answer 1

<div ng-show="imageLoaded"><!--your image--></div>
<div ng-show="!imageLoaded"><!--default image--></div>

如果图像加载完毕，在控制器中

将$ scope.imageLoaded设置为true。

Answer 2

您应该设置一个<div>，其中包含您正在等待的图片的宽度和高度。

Answer 3

Basic idea is create a directive and add it as attribute to img tag.

JS:

app.directive('imageonload', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            element.bind('load', function() {
                alert('image is loaded');
            });
            element.bind('error', function(){
                alert('image could not be loaded');
            });
        }
    };
});
HTML:

 <img ng-src="{{src}}" imageonload />

等待angularJS图像

3 个答案: