Generating preview of images at its original size in ng-file-upload

Asked Oct 13 '15 at 18:31

Active Oct 13 '15 at 20:23

Viewed 3,133 times

I wish to use ngf-thumbnail directive of ng-file-upload angular plugin to generate previews of images once a user selects them from their computer. However, the size of the image is restricted to the size of the element that contains the thumbnail or the size needs to be specified when the directive is created.

Is it possible to generate preview of images using their original size within the framework of the plugin. I am wondering if there is another option than reading the image using FileReader/onload event (Getting Image Dimensions using Javascript File API)

Please this for code sample: http://jsfiddle.net/danialfarid/maqbzv15/

 <img ng-show="myForm.file.$valid" ngf-thumbnail="!picFile.$error && picFile" class="thumb"> <button ng-click="picFile = null" ng-show="picFile">Remove</button>

This is a JS Fiddle on how to use this plugin and you can try to reproduce the problem by uploading a image to it. Changing the height and width of the 'thumb' class will not work.

edited May 23 '17 at 11:44

Community

asked Oct 13 '15 at 18:31

Himanshu Ranavat

add code in your question as well – Vineet Oct 13 '15 at 18:31
added jsfiddle as requested – Himanshu Ranavat Oct 13 '15 at 20:23
1

Use `ngf-src` instead of `ngf-thumbnail`. – danial Oct 14 '15 at 16:37
thanks for clarifying. For those, who just want the size of the image - you can also do Upload.imageDimensions as suggested by @danial here: https://github.com/danialfarid/ng-file-upload/issues/1059 – Himanshu Ranavat Oct 14 '15 at 18:40

Generating preview of images at its original size in ng-file-upload

0 Answers0