Use cordovaFile in ionic application

1

Hello everyone,

I am new on ionic and pretty ashamed to create a topic for something I think is a simple, but i can not figure it out.
I would like to use files in my mobile phone application (read, write, download, upload).

So I go on this web page, http://ngcordova.com/docs/#File, run this command in a terminal:
-cordova plugin add org.apache.cordova.file
-cordova plugin add org.apache.cordova.file-transfer

Now in my controler, i give the $cordovaFile parameter:

.controller(‘DashCtrl’, function($scope, $cordovaFile) {
})

Now I am here I don’t know what to do anymore. I think I maybe have to specify something in my ‘index/html’, but I dont know what. I know cordova.file is now installed in my plugin, but how to use it ?

Thank you very much

Mat

2

You provided this link: http://ngcordova.com/docs/#File if you say you want to see the source, you get redirected to https://github.com/driftyco/ng-cordova/blob/master/src/plugins/file.js

In this file you see the $cordovaFile factory, which you inject in your controller. Basically, if you don’t put this javascript source in your app, the $cordovaFile factory is undefined and your code won’t be able to run. So create a file with the $cordovaFile factory js code and load it with a script tag in your index.html :slight_smile: After this, you can inject $cordovaFile in your controller and use exposed functions as per the documentation :wink:

4

Ok, So I copied the factory in file.js in the https://github.com/driftyco/ng-cordova/blob/master/src/plugins/file.js webpage.
Saved it as cordovaFile.js and load it in my index.html : script src=“js/cordovaFile.js”></script

At this point, i still have this error:
Error: [$injector:unpr] Unknown provider: $cordovaFileProvider <- $cordovaFile

Thank you

5 
var angMod = angular.module('app.dash', ['$cordovaFile']);
angMod.controller('DashCtrl',  function($scope, $cordovaFile) {})

For the module where your controller is in, make sure it is injectable :slight_smile: Also I think this should work as well (espescially better if you ONLY use the cordovaFile in a single controller:

.controller('DashCtrl', ['$cordovaFile'], function($scope, $cordovaFile) {})
6

angular.module(‘starter.controllers’, [])

.controller(‘DashCtrl’, [’$cordovaFile’], function($scope, $cordovaFile) {
})

here is my statement.
I have this error:
Error: [ng:areq] Argument ‘DashCtrl’ is not a function, got string

Thank you

7 
angular.module('starter.controllers', ['$cordovaFile'])

.controller('DashCtrl', function($scope, $cordovaFile) {
})

try this to see if it works :slight_smile:

8

it doesn’t:

[$injector:modulerr] Failed to instantiate module starter due to:
Error: [$injector:modulerr] Failed to instantiate module starter.controllers due to:
Error: [$injector:modulerr] Failed to instantiate module $cordovaFile due to:
Error: [$injector:nomod] Module ‘$cordovaFile’ is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

9

If you copied the contents of the file at https://github.com/driftyco/ng-cordova/blob/master/src/plugins/file.js, then the module name you should be including is actually ngCordova.plugins.file (unless you changed it), so you should try this:

angular.module('starter.controllers', ['ngCordova.plugins.file'])
1 Like
10

Oh ok, I dont have the error anymore.

Thank you very much guys :smile:

1 Like
11

I have installed cordova, wrote this in the index.html :
script src=“lib/ngCordova/dist/ng-cordova.js”>
script src=“cordova.js”>

and my controller look like this:
angular.module(‘starter.controllers’, [‘ngCordova’, ‘ngCordova.plugins.file’] )

.controller(‘DashCtrl’, function($scope) {
window.resolveLocalFileSystemURL(cordova.file.applicationDirectory + “www/index.html”, gotFile, fail);

})

But fail on the resolve call because “cordova is not defined”. I dont understand what I missed again.
Thanks

12

cordova is only available in native devices, so if you test on the browser it won’t work :wink:

13

Oh indeed, thank you very much for help guys. I have been able to do what i wanted :stuck_out_tongue:

14

hello. I am a new ionic programmer. I have developed a new project. the project is writing a new png file using $cordovafile. Now I am using Android Phone.
my code.
var v_canvas = document.getElementById(“canvas”);
var v_dataURI = v_canvas.toDataURL().replace( /data:image/png;base64,/, ‘’ );

      // WRITE
      $cordovaFile.writeFile("file:///storage/sdcard0/", "test_1.png", v_dataURI, true)
        .then(function (success) {
          // success
          console.log("<<<<<<<< : write file ok");
        }, function (error) {
        console.log("<<<<<<<< : write file error");
          // error
        });

The function is success on my Android Phone. But the file can’t open. What’s problem. Please help me. thanks.