cordovangcordovavisual-studio-2015cordova-plugin-file

cordova file is undefined in Cordova application


=====Cordova file is undefined=====

Hi.

I'm trying to learn some mobile development with Cordova. I want to create an application instagram-like, in which memories will be stored. The application uses two pages :

My code to create a file and writing a new memory inside seems to work (I can't open the file created so I can't be sure, but I don't get any error...). I'm now trying to use the ngCordova file plugin to access the file and display it's content.

Here is my code (for now) : note : my code has been translated in english for a better comprehension. I hope I didn"t make any translation error, unrelated to the topic at hand

index.html

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <meta charset="utf-8" />
  <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">

  <!-- Donwloaded files -->
  <script src="scripts/jquery-2.1.4.js"></script>
  <script src="scripts/angular.js"></script>
  <script src="scripts/angular-route.js"></script>
  <script src="scripts/bootstrap.js"></script>
  <script src="scripts/ng-cordova.js"></script>

  <!--Own libraries-->
  <script src="lib/index.js"></script>
  <script src="lib/app.js"></script>
  <script src="lib/controleurs/addMemoryController.js"></script>
  <script src="lib/controleurs/memoriesController.js"></script>

  <!-- Cordova reference -->
  <script src="cordova.js"></script>
  <script src="scripts/platformOverrides.js"></script>
</head>

index.js (first loaded file, auto-generated)

(function () {
    "use strict";

    document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );

    function onDeviceReady() 
        document.addEventListener( 'pause', onPause.bind( this ), false );
        document.addEventListener( 'resume', onResume.bind( this ), false );

        //angular.bootstrap(document, ['myMemories']); //aborted try. Give me the error : Uncaught Error: [ng:btstrpd] App Already Bootstrapped with this Element 'document'
    };

    function onPause() {
    };

    function onResume() {
    };
} )();

app.js (declares the application)

var app = angular.module('myMemories', ['ngRoute','ngCordova']);

app.config(function ($routeProvider) {
    $routeProvider
        .when("/", {
            templateUrl: "views/memories.html",
            controller: "memoriesController"
        })
        .when("/ajouteSouvenir", {
            templateUrl: "views/addMemory.html",
            controller: "addMemoryController"
        })
        .otherwise({ redirectTo: "/" });

});

memoriesController.js

app.controller("souvenirsControleur", function ($scope,$rootScope,$cordovaFile) {

if (!$rootScope.memoriesList) {
    $cordovaFile.readAsText(cordova.file.dataDirectory, "stored_memories.json").then(
        function (pResult) {
            if (typeof (pResult) == "string") {
                $rootScope.memoriesList= JSON.parse(pResult);
            } else {
                $rootScope.memoriesList= pResult;
            }
        },
        function (pError) { console.log("error : readAsText"); console.log(pError);}
    );
}
});

I get the following error : TypeError: Cannot read property 'dataDirectory' of undefined. I though I used the right thing, which I found here : http://ngcordova.com/docs/plugins/file/

Here is what I tried but didn't work :

I'm quite sure my mistake is something obvious, but I can't grasp it...

I can give more code if you need it.


Solution

  • I don"t really get what happened here. Cordova.file was simply not loaded correctly.

    I created a new project, added the pluging from the beggining and wrote everything back wihtout any other change. Let's put VisualStudio at fault here, it's easier :)