Search code examples
angularjscordovaionic-frameworkcordova-plugins

how to attached file in ionic +cordova?


I am making a simple app on iOS. Upon clicking a button I want the gallery or file chooser or file explorer to open, and for the user to be able to select any .txt or .pdf, .jpg or .png file from gallery.

So I want to know how to open file explore in the Ionic Framework. Is there any plugin available in Ionic or Cordova that opens the file explore and uploads to to a server? I don't want to use the email composer plugin.


Solution

  • You could try a simple HTML5 file input:

    <input type="file">
    

    this should open the native browser on iOS or Android and allow you to select any kind of file. For uploading, you could try the $cordovaFileTransfer plugin.

    If you're targeting iOS8, which appears to have issues with the file input, I'd suggest you check out FineUploader, a JS solution.


    Alternatively, you can use ngCordova's $cordovaImagePicker and $cordovaFileTransfer plugins. Install ngCordova first with Bower or include the JS files manually and inject ngCordova as an Angular dependency. Then, install the plugins with:

    cordova plugin add https://github.com/wymsee/cordova-imagePicker.git
    cordova plugin add cordova-plugin-file-transfer
    

    Then, you can use the getPictures() method and the upload() methods to select photos on the device and upload them to your server. However, you won't be able to select and upload other kinds of files formats .txt or .pdf because $cordovaImagePicker only picks images