The Angular ngSrc directive serves to properly set an image src via Angular. As anything in Angular, it updates the image as soon as the contained Angular expression changes. However, when the ng-src attribute is empty, Angular will not empty the src attribute. To overcome this, use the trick below.

<img ng-src="{{ element.image || '//:0' }}" />

Background

Opscomplete powered by

Save money by migrating from AWS to our fully managed hosting in Germany.

• Trusted by over 100 customers
• Ready to use with Ruby, Node.js, PHP
• Proactive management by operations experts

Read more Show archive.org snapshot

The ngSrc directive explicitly returns when the attribute value is falsy. As a workaround, set a "blank" image src when the image is empty. As somebody on Stackoverflow Show archive.org snapshot writes, //:0 serves this purpose: It adopts the current protocol, omits the hostname and sets the port to zero, which is invalid and should be killed by the network layer.

As a result, Angular should now correctly empty the src attribute when ng-src empties.