appirio-tech/angular-img-fallback

Name: angular-img-fallback

Owner: Topcoder

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

Forked from: dcohenb/angular-img-fallback

Created: 2015-10-22 23:50:19.0

Updated: 2015-10-03 12:44:19.0

Pushed: 2015-10-04 17:15:29.0

Homepage: null

Size: 362

Language: null

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

Angular Image Fallback

Angular directives that handles image loading, it has fallback-src to handle errors in image loading and loading-src for placeholder while the image is being loaded.

Bower Download

bower install angular-img-fallback

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

• 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'}}" />

• Or both! loading placeholder and a fallback source can work together
  <img ng-src="{{'path/to/img.jpg'}}" loading-src fallback-src />

Icons license

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