Replace default image if image not found -angularjs

What might be the best possible condition for checking and displaying if the image path is undefined in AngularJS. I tried like this:

HTML:
<div ng-src="{{imageUrl}}" == "null" || src="img/avatar.png" >

CONTROLLER:
$scope.imageUrl="125.178.1.127/uploads/image" +$scope.imageName;

If $ scope.imageName is undefined, I need to load / show the default image img/avatar.png

+4
source share
2 answers

This should work:

<div ng-src="{{imageName ? imageUrl : 'img/avatar.png'}}">
+7
source

I am using Angular Image Fallback modul and it works great! Just put fallback-src and load-src in the image tag.

In your module:

angular.module('starter', ['dcbImgFallback'])

In your HTML:

<img ng-src="your image path" fallback-src="your image default" loading-src="your image loading">

This also works in ng-repeat. Hope this helps.

+1
source

All Articles