How to use the image previews generated by blueimp file upload?

I'm using blueimp's jquery-file-upload successfully in angular with a java back-end. It uploads correctly with a POST call for each file. The built-in thumbnail previews from jquery.fileupload-image.js appear when a file is selected but disappear when complete.

I am unable to store my own generated thumbnails on my server, so I was wondering if I could just inject these previews instead. How would I show these previews?

Front end (inside ng-repeat):

        <td data-ng-switch data-on="!!file.thumbnailURL">
      <div class="preview" data-ng-switch-when="true">  
//shows when upload complete.. unsure what to put here
        <div class="previewImage"></div>
      </div>
      <div class="preview" data-ng-switch-default data-file-upload-preview="file">  
//already shows generated preview before upload finishes</div>
    </td>

And I believe I need to do something like this in the controller:

//Listen to upload library for successful upload
        $scope.$on('fileuploaddone', function(e,data){
            if (data.files[0].preview){
                //inject preview somehow to DOM's .previewImage?
            }
        })

Solution

I was able to display the front-end generated preview thumbnail by doing

HTML:

<img id="preview-image" width="auto" height="auto" alt=""></img>

Controller:

$scope.$on('fileuploadprocessalways', function(e, data){
              if (data.files[0].preview){
                  var canvas = data.files[0].preview; //grab the preview
                  var dataURL = canvas.toDataURL();  //grab the url
                  $("#preview-image").css("background-image", 'url(' + dataURL +')'); //give it to DOM
                  $("#preview-image").css("height", canvas.height);
                  $("#preview-image").css("width", canvas.width);
                  console.log("Injecting canvas with dimensions: "+canvas.width+"x"+canvas.height);
              }

        });