繁体   English   中英

AngularJS和cordova:Web应用程序正常运行,但在cordova上不工作:无法实例化模块

[英]AngularJS and cordova : web app working but not on cordova : Failed to instantiate module

我正在尝试使用cordova制作基于Web应用程序(简单的待办事项列表)的移动应用程序。 它可以在涟漪下工作,但在电话上,angularJS似乎没有激活。

在Android Studio中,我在控制台中得到了这个:

E / Web控制台:未捕获的错误:[$ injector:modulerr]由于以下原因而无法实例化模块todoList:错误:[$ injector:nomod]模块'todoList'不可用! 您可能拼错了模块名称,或者忘记了加载它。 如果注册模块,请确保将依赖项指定为第二个参数。

这是index.html:

<!DOCTYPE html>
<html lang="fr" ng-app="todoList">
    <head>
        <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 *">
        <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">
        <title>Pense-bête</title>        
    </head>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript" src="js/angular.js"></script>
    <script type="text/javascript" src="js/todoList.js"></script>

    <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>

                    <button class="glyphicon glyphicon-refresh" ng-click="savedata()">Synchroniser ma liste</button>
                </div>
                        <div class="view" ng-model="result">
                            <span>{{result}}</span>
                        </div>
            </article>
        </section>
    </body>
</html>

和todolist.js:

// js / todoList.js

'use strict';


/**

/**
 * Déclaration du module todoList
 */
var todoList = angular.module('todoList',[]);


/**
 * Contrôleur de l'application "Todo List" décrite dans le chapitre "La logique d'AngularJS".
 */
todoList.controller('todoCtrl', ['$scope',
    function ($scope) {

        // Pour manipuler plus simplement les todos au sein du contrôleur
        // On initialise les todos avec un tableau vide : []
        var todos = $scope.todos = [];

        // Ajouter un todo
        $scope.addTodo = function () {
            // .trim() permet de supprimer les espaces inutiles
            // en début et fin d'une chaîne de caractères
            var newTodo = $scope.newTodo.trim();
            if (!newTodo.length) {
                // éviter les todos vides
                return;
            }
            todos.push({
                // on ajoute le todo au tableau des todos
                title: newTodo,
                completed: false
            });
            // Réinitialisation de la variable newTodo
            $scope.newTodo = '';
        };

        // Enlever un todo
        $scope.removeTodo = function (todo) {
            todos.splice(todos.indexOf(todo), 1);
        };

        // Cocher / Décocher tous les todos
        $scope.markAll = function (completed) {
            todos.forEach(function (todo) {
                todo.completed = !completed;
            });
        };

        // Enlever tous les todos cochés
        $scope.clearCompletedTodos = function () {
            $scope.todos = todos = todos.filter(function (todo) {
                return !todo.completed;
            });
        };
    }
]);

为了在手机上调试网站,您可以使用safari移动检查器访问控​​制台并开始记录消息,以及查看可能弹出的任何错误。 您可以在此处找到操作方法: http : //webdesign.tutsplus.com/articles/quick-tip-using-web-inspector-to-debug-mobile-safari--webdesign-8787

天哪,我的src中只有todoList.js而不是todolist.js。

至少,它使我能够使用chrome发现远程调试。

谢谢 !

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM