Question

我正在尝试将angularjs用于我的phonegap应用程序。我成功地创建了cordova项目。它正在发挥作用。 “连接”变得“准备好了”。一切都好吗

我按照这种方式：使用angularjs服务来检测cordova'ready'事件。

查看代码，问题出在问题的最后

的index.html

<!DOCTYPE html>
<html ng-app="MyApp">
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <meta name="msapplication-tap-highlight" content="no" />
        <title>Hello World</title>
    </head>
    <body ng-controller="MyController">
        <div class="app">
            <h1>Apache Cordova</h1>
            <div id="deviceready" class="blink">
                <p class="event listening" ng-hide="ready">Connecting to Device</p>
                <p class="event received"  ng-show="ready">Device is Ready</p>
            </div>
        </div>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/q.js"></script>
        <script type="text/javascript" src="js/angular.min.js"></script>
        <script type="text/javascript" src="js/fsCordova.js"></script>
        <script type="text/javascript" src="js/app.js"></script>
    </body>
</html>

请注意我已将display: none;从.event.received的css中移除到css文件

fsCordova.js

angular.module('fsCordova', []).service('CordovaService', ['$document', '$q',
  function($document, $q) {

    var d = $q.defer(),
        resolved = false;

    var self = this;
    this.ready = d.promise;

    document.addEventListener('deviceready', function() {
      resolved = true;
      d.resolve(window.cordova);
    });

    // Check to make sure we didn't miss the 
    // event (just in case)
    setTimeout(function() {
      if (!resolved) {
        if (window.cordova) d.resolve(window.cordova);
      }
    }, 3000);
}]);

app.js

(function(){

    var app = angular.module('myApp', ['fsCordova']);

    app.controller('MyController', function($scope, CordovaService) {

        this.ready = false;

        CordovaService.ready.then(function() {
            this.ready = true;
        });

    });

})();

问题？使用android SDK的监视工具，我在日志中看到来自angular.ks的错误

Error: $injector:modulerr
Module Error

Failed to instantiate module MyApp due to:
Error: [$injector:nomod] http://errors.angularjs.org/1.2.20/$injector/nomod?p0=MyApp
    at Error ()
    at file:///android_asset/www/js/angular.min.js:6:450
    at file:///android_asset/www/js/angular.min.js:20:466
    at file:///android_asset/www/js/angular.min.js:21:469
    at file:///android_asset/www/js/angular.min.js:33:267
    at Array.forEach (native)
    at q (file:///android_asset/www/js/angular.min.js:7:280)
    at e (file:///android_asset/www/js/angular.min.js:33:207)
    at dc (file:///android_asset/www/js/angular.min.js:36:309)
    at c (file:///android_asset/www/js/angular.min.js:18:139)

我认为我的.js文件缺少拼写错误的问题，但文件名和文件路径是正确的。

请帮助我调试。

Answer 1

在html标记中更改此代码：

ng-app="MyApp"

到

ng-app="myApp"

如何在Phonegap中使用angularJs？

1 个答案: