title: Ionic2: Load and Save image to device using cordova-file-transfer
body: <p>I'm working on app in Ionic2 and I'm downloading an image using "<a href="https://github.com/apache/cordova-plugin-file-transfer" rel="nofollow">cordova-plugin-file-transfer</a>" with the following code thanks to(<a href="https://github.com/dsgriffin/ionic-2-file-transfer-example" rel="nofollow">ionic-2-file-transfer-example</a>):</p>
  
  <pre><code>  downloadImage(image, name) {
        this.platform.ready().then(() =&gt; {
          const fileTransfer = new FileTransfer();
          let targetPath; // storage location depends on device type.
  
          // make sure this is on a device, not an emulation (e.g. chrome tools device mode)
          if(!this.platform.is('cordova')) {
            return false;
          }
  
          if (this.platform.is('ios')) {
            targetPath = cordova.file.documentsDirectory + name;
          }
          else if(this.platform.is('android')) {
            targetPath = cordova.file.dataDirectory + name;
          }
          else {
            // do nothing, but you could add further types here e.g. windows/blackberry
            return false;
          }
  
          fileTransfer.download(encodeURI(image), targetPath,
              (result) =&gt; {
           //Here i need to load it back
           this.img = targetPath; // &lt;&lt;-- ERROR -&gt; Can't load from device
              },
              (error) =&gt; {
       console.log("error: "+error);
              }
          );
        });
      }
  </code></pre>
  
  <p>Its working perfectly (The image is saved on the device), the thing is, I need to load this image (that I stored in my device) in my app.</p>
  
  <p>I saw the following code in this cordova library:</p>
  
  <pre><code>function readBinaryFile(fileEntry) {
      fileEntry.file(function (file) {
          var reader = new FileReader();
  
          reader.onloadend = function() {
  
              console.log("Successful file read: " + this.result);
              // displayFileData(fileEntry.fullPath + ": " + this.result);
  
              var blob = new Blob([new Uint8Array(this.result)], { type: "image/png" });
              displayImage(blob);
          };
  
          reader.readAsArrayBuffer(file);
  
      }, onErrorReadFile);
  }
  </code></pre>
  
  <p>but, I couldn't succeed to use it (or to embed it in my code), anyone know how can I load back an image I stored and push it in to my ionic code: </p>
  
  <pre><code>&lt;img [src]="avatar" style="margin: auto;" alt="Profile"&gt;
  this.avatar = "???";
  </code></pre>
  
  <p>Thank you!!</p>