Application web porté sous cordova : erreur sur

**nightf69** · 29/07/2015, 15h06

Bonjour,

J'ai essayé de porter une application basée sur angular (une simple todolist trouvé online) en utilisant cordova.

Cela fonctionne parfaitement en mode web sur un pc :

Impossible de le faire marcher sur mon téléphone et sur l'émulateur genymotion. Voici le message d'erreur que j'obtiens uniquement sur Android Studio :

E/Web Console﹕ Uncaught Error: [$injector:modulerr] Failed to instantiate module todoList due to:
Error: [$injector:nomod] Module 'todoList' 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.
http://errors.angularjs.org/1.3.12/$injector/nomod?p0=todoList
at file:///android_asset/www/js/angular.js:63:12
at file:///android_asset/www/js/angular.js:1767:17
at ensure (file:///android_asset/www/js/angular.js:1691:38)
at module (file:///android_asset/www/js/angular.js:1765:14)
at file:///android_asset/www/js/angular.js:4097:22
at forEach (file:///android_asset/www/js/angular.js:323:20)
at loadModules (file:///android_asset/www/js/angular.js:4081:5)
at createInjector (file:///android_asset/www/js/angular.js:4007:11)
at file:///android_asset/www/js/angular.js:1445:20
at bootstrap (file:///android_asset/www/js/angular.js:1466:12)
http://errors.angularjs.org/1.3.12/$injector/modulerr?p0=todoList&p1=Error%3A%20%5B%24injector%3Anomod%5D%20Module%20'todoList'%20is%20not%20available!%20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it.%20If%20registering%20a%20module%20ensure%20that%20you%20specify%20the%20dependencies%20as%20the%20second%20argument.%0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.3.12%2F%24injector%2Fnomod%3Fp0%3DtodoList%0A%20%20%20%20at%20file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A63%3A12%0A%20%20%20%20at%20file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A1767%3A17%0A%20%20%20%20at%20ensure%20(file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A1691%3A38)%0A%20%20%20%20at%20module%20(file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A1765%3A14)%0A%20%20%20%20at%20file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A4097%3A22%0A%20%20%20%20at%20forEach%20(file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A323%3A20)%0A%20%20%20%20at%20loadModules%20(file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A4081%3A5)%0A%20%20%20%20at%20createInjector%20(file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A4007%3A11)%0A%20%20%20%20at%20file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A1445%3A20%0A%20%20%20%20at%20bootstrap%20(file%3A%2F%2F%2Fandroid_asset%2Fwww%2Fjs%2Fangular.js%3A1466%3A12) at file:///android_asset/www/js/angular.js:4120

Voici les 2 fichiers utilses :
index.html :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!DOCTYPE html>
<html lang="fr" ng-app="todoList">
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
        <link rel="stylesheet" type="text/css" href="css/style.css">
    </head>
 
    <body>
        <header>
            <h1>Pense bête</h1>
        </header>
        <section ng-controller="todoCtrl">
            <form id="todo-form" ng-submit="addTodo()">
                <input id="new-todo" placeholder="Que voulez-vous acheter ?" ng-model="newTodo" />
            </form>
            <article ng-show="todos.length">
                <ul id="todo-list">
                    <li ng-repeat="todo in todos" ng-class="{completed: todo.completed}">
                        <div class="view">
                            <input class="mark" type="checkbox" ng-model="todo.completed" />
                            <span>{{todo.title}}</span>
                            <span class="close" ng-click="removeTodo(todo)">x</span>
                        </div>
                    </li>
                </ul>
                <div>
                    <input id="mark-all" type="checkbox" ng-model="allChecked" ng-click="markAll(allChecked)" />
                    <label class="btn btn-info" for="mark-all">Tout cocher</label>
                    <button class="btn btn-danger" ng-click="clearCompletedTodos()">Supprimer les tâches cochées</button>
                </div>
                        <div class="view" ng-model="result">
                            <span>{{result}}</span>
                        </div>
            </article>
        </section>
   <!--     <script src="cordova.js"></script>
        <script src="js/index.js"></script>-->
        <script src="js/angular.js"></script>
        <script src="js/todoList.js"></script>
    </body>
 
</html>

todolist.js :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
// js/todoList.js
//'use strict';
//var demoApp = angular.module('demoApp', [
//    'todoList'
//]);
 
/**
 * Déclaration du module todoList
 */
var todoList = angular.module('todoList',[]);
 
 
todoList.controller('todoCtrl', ['$scope',
    function ($scope) {
        var todos = $scope.todos = [];
        $scope.addTodo = function () {
            var newTodo = $scope.newTodo.trim();
            if (!newTodo.length) {
                return;
            }
            todos.push({
                title: newTodo,
                completed: false
            });
            $scope.newTodo = '';
        };
        $scope.removeTodo = function (todo) {
            todos.splice(todos.indexOf(todo), 1);
        };
        $scope.markAll = function (completed) {
            todos.forEach(function (todo) {
                todo.completed = !completed;
            });
        };
        $scope.clearCompletedTodos = function () {
            $scope.todos = todos = todos.filter(function (todo) {
                return !todo.completed;
            });
        };
    }
]);

**Marco46** · 30/07/2015, 10h24

Apparemment la racine pour cordova c'est android_asset donc tes chemins dans ton index.html ne devraient-ils pas être plutôt :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<script src="www/js/angular.js"></script>
<script src="www/js/todoList.js"></script>

?

**Marco46** · 30/07/2015, 10h27

C'est bizarre ton truc parce que si ce que je viens d'écrire était vrai tu n'aurais pas cette erreur car Angular n'aurait pas été trouvé et donc n'aurait pas démarré. Ceci je pense quand même qu'il s'agit d'un problème de chemin d'accès dans ton build et non d'un problème de programmation.

Application web porté sous cordova : erreur sur

AngularJS

Discussions similaires

Partager

Partager