Can't download image file with file transfer plugin

I am trying to download an image file to my App’s directory using the file transfer plugin, I am using the example from the ngCordova site to fire the function on a click event ($scope.downloadFile).

Here is an example of my code:

// DOWNLOAD FILE
$scope.downloadFile = function() {
  console.log('clicked DOWNLOAD FILE button');
  var url = "http://animals.sandiegozoo.org/sites/default/files/styles/feeds_animal_thumbnail/public/koala_thumb.jpg";
  var targetPath = fileDir + 'test/' + "testImage.jpg";
  var trustHosts = true
  var options = {};

  $cordovaFileTransfer.download(url, targetPath, options, trustHosts)
    .then(function(result) {
      // Success!
      console.log(result);
    }, function(err) {
      // Error
      console.log(err);
    }, function (progress) {
      $timeout(function () {
        $scope.downloadProgress = (progress.loaded / progress.total) * 100;
        console.log(downloadProgress);
      })
    });
};

when I click the download button I can see my console.log message but then nothing else and the app crashes after a few seconds. my ‘fileDir’ path is correct as I am able to create and write text files, and is set inside the .run function.

Any advice on this would be really appreciated.