AngualrJS directive use to shows a fallback image when img element get 404 or other errors.
1 person uses it
Author: 2735087?v=3 stiekel

Bower version __npm version


AngualrJS directive that shows a fallback image when img element can not show picture correct.


You can install this directive with npm:

npm install --save angular-image-404

Install with Bower:

bower install --save --allow-root angular-image-404

or just download it.


After install, you need to include the dist/angular-image-404.js in html like this:

And add directive module in dependience list:

var app = angular.module('app', ['angular-image-404']);

Now you can use it in html like this:

And you can set the attribute image-404 as empty:

if image-404 set as empty, directive will get placeholder image from

Test & Release

If you want to run example, you should run npm i:

npm i

and run gulp with test task:

gulp test

BTW, gulp release will create release js file in ./dist folder.

comments powered by Disqus
This page was last updated over 2 years ago.