Issue display image downloaded using cordova file transfer plugin

ionic-v1
1

I am building an app using Ionic and use cordova file transfer
plugin. Here my code to download image file from remote location. This
works file.

$ionicPlatform.ready(function(){
options = {};
url = "http://view.ionic.io/phones.png";
var targetPath = cordova.file.dataDirectory + "a.jpg";
var trustHosts = true;
$cordovaFileTransfer.download(url, targetPath, options, trustHosts)
.then(function(entry) {
        value = angular.toJson(entry.nativeURL);
        $scope.imgFile = entry.toURL();
        console.log($scope.imgFile); 
        $scope.i2 =    entry.toInternalURL(); 
        console.log($scope.i2);
}, function(err) {
    // Error
    console.log("error");
}, function (progress) {
    $timeout(function () {
      $scope.downloadProgress = (progress.loaded / progress.total) * 100;
    })
});
});

My first console.log give me local downloaded image path which is:
file:///Users/pratik/Library/Developer/CoreSimulator/Devices/2F1CF925-E0FC-4122-9FE7-7AFA6E5AABAD/data/Containers/Data/Application/DBE0933F-E62C-410B-81DF-20B941432E8F/Library/NoCloud/a.jpg

Second console.log give me following url : cdvfile://localhost/library-nosync/a.jpg

I checked my first url in browser and it display downloaded image.

My problem is I none of these urls are display image in view. Here my code in view to display image:

{{downloadProgress}}
<img ng-src="/a.jpg"> 
<img ng-src="{{i1}}"> 
<img ng-src="{{i2}}">

Can you please point me what i am doing wrong?

2

Have you found a solution to your problem?

3

Please am having the same issue…any help is most appreciated…

4

entry.toURL(); is worked for me on ios device but i have to add
<allow-intent href="file://*/*"/>
to config.xml.

note: on ios simulator images not displayed.