Get a base64 encoded image using ng-flow in AngularJS

Get a base64 encoded image using ng-flow in AngularJS

Posted by: Hoa Nguyen | November 24, 2015
Here is an example of how you can get a Base64 encoded image using the ng-flow for the image upload, for instance, if you need to send the image in a JSON request. As you may have noticed, ng-flow returns a file object, however you still can get the Base64 string with the help of HTML5 FileReader:
1
2
3
4
5
6
varbase64;
var fileReader = new FileReader();
fileReader.onload = function (event) {
base64 = event.target.result;
};
fileReader.readAsDataURL(flowFile.file);
Here, the base64 variable will contain the Base64 string of the image.
You can try it yourself on CodePen.
Source From Sysgears
Read Further on AngularJS Series
Get image dimensions with ng-flow
Get a base64 encoded image using ng-flow in AngularJS
How to trigger a method with the keyboard shortcut in AngularJS
Moving a page element without affecting its scope in AngularJS
Launch Ionic app with a web or email link
Braintree and Angular.JS drop in integration
Minification safe Angular.js
AngularJS : Multiple Views, Layout Template and Routing
AngularJS: Implementing Routes And Multiple Views
AngularJS : Fetching data from the server
Building Intuitive Frontend Interfaces with AngularJS – An Overview!

Comment