Warten auf angularJS image

Question

Wie kann ich in AngularJS warten und ein Standardbild anzeigen, bis die Direktive das reale Bild aktualisiert (das noch geladen wird).

Ich brauche nur der $ scope.imageLoaded auf true

Answer 1

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

in Ihrem Controller jede Sekunde und nicht auf Last um das Bild zu überprüfen gesetzt, wenn das Bild fertig geladen ist.

Answer 2

sollten Sie eine <div> mit der Breite und der Höhe des Bildes, auf das Sie warten, festlegen.

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 />