angular-img-fallback

Utility to work with loading images, has fallback-src to handle erros in image loading and loading-src for images loading placeholders
Homepage: http://dcb.co.il
9 people use it
Author: 1086354 dcohenb

Angular Image Fallback

Utility to work with loading images, has fallback-src to handle erros in image loading and loading-src for images loading placeholders.

Installation

  1. Download and import the plugin script. <script src="lib/angular-img-fallback/angular.dcb-img-fallback.min.js"></script>
  2. Add dcbImgFallback to your angular app module dependencies list. angular.module('myAngularApp', ['dcbImgFallback']);
  3. Add the fallback-src attribute to yout img <img ng-src="path/to/img.jpg" fallback-src />

Usage

Just add the fallback-src and the loading-src attributes to your <img /> tags <img ng-src="path/to/img.jpg" fallback-src loading-src /> Make sure you use ng-src as your image src attribute.

Advanced options

  • Simple usage, will replace to a default missing image placeholder <img ng-src="path/to/img.jpg" fallback-src />

  • Custom fallback, will replace to your own custom missing image <img ng-src="path/to/img.jpg" fallback-src="path/to/fallback.jpg" />

  • Loading placeholder, show a loading placeholder until image loads <img ng-src="path/to/img.jpg" loading-src="path/to/fallback.jpg" />

  • Custom Loading placeholder, show a custom image loading placeholder until image loads <img ng-src="path/to/img.jpg" loading-src="path/to/loading.jpg" />

Icons license

Icons are provided from http://icomoon.io/ under the GNU General Public License v3.0 http://www.gnu.org/licenses/gpl.html

comments powered by Disqus
This page was last updated about 3 years ago.