angularJS <input type="file> 图片的base64编码

<input type="file" id="file" name="file"
    ng-model="Ctrl.picture"
    accept="image/jpeg,image/png,image/jpg"
    onchange="angular.element(this).scope().myFunction(this.files)">

坑一：angularJS的input-file会让ng-change失效

解决办法是用onchange覆盖ng-change，格式为：

onchange="angular.element(this).scope().yourfunction()

如何才能获取图片的base64编码？

HTML代码里，onchange事件触发的handleConFiles函数，如下：

function myFunction(files){
    var file = files[0];
    var reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = function(theFile) {
        imagedata = theFile.target.result  //base64编码,用一个变量存储
    };
}

FileReader()读取文件，readAsDataURL读取指定file or Blob对象中的内容。theFile.target.result就是需要的图片base64编码 , 这里获取的base64字符串具有一定的格式，console.log(theFile.target.result)会发现，打印出来的数据为：

data:image/png;base64,base64string

通过截取字符串去掉data:image/png;base64,

var imageDataBase64 = imagedata .substr(imagedata .indexOf('base64,') + 'base64,'.length);

至此就得到了图片的base64编码。

转自：http://www.cnblogs.com/ijinxin/p/6728140.html