How to store Base64-encoded image data in an AngularJS app?

Question

I make a post request and receive an array of image URLs. I need to then convert these images to base64 and save them as strings. Here is the code for converting the images (i used this reference: http://jsfiddle.net/handtrix/YvQ5y/):

 var convertImgToDataURLviaCanvas = function(url, callback, outputFormat){
    var img = new Image();
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
        var canvas = document.createElement('CANVAS');
        var ctx = canvas.getContext('2d');
        var dataURL;
        canvas.height = this.height;
        canvas.width = this.width;
        ctx.drawImage(this, 0, 0);
        dataURL = canvas.toDataURL(outputFormat);
        callback(dataURL);
        canvas = null; 
    };
    img.src = url;
};

Here is the function I call in the .then function after I receive the result from the $http post call:

 var base64Image = convertImgToDataURLviaCanvas(resultImages[i], function(base64Img){
      console.log(base64Img)
      dpd.studentanswers.post({
                    studentName: "Student" ,
                    answerImage: 'http://imagesource.com',
                    questionPrompt: image,
                    answerImageBase64: 'http://imagesource.com'
                    }, function(todo, err) {
                        if (err) {
                        alert(err.message || (err.errors && err.errors.title));
                        return;
                    }});
 });    

It is not doing anything. It does not even log anything. I would greatly appreciate some help.