Question

我使用了缩放平台Yeoman来构建一个包含Cordova的简单AngularJS应用程序。在构建iOS和Android之前，我也在使用Grunt构建解决方案。

当我尝试注入一个初始化Device Ready的工厂供我在AppBrowser中使用时，我的问题不断出现。

我得到的错误是：

错误：$ injector：modulerr模块错误

这意味着我的模块没有被加载，我的模块是cordova。我已经阅读了对角度的依赖注入，并且过去没有遇到过它的问题。因此，我围绕Angular请求设置模块，我仍然收到此错误。

我的工厂模块如下所示：

angular.module('App')
.factory('cordova',['$q', '$window', function ($q, $window) {
var d = $q.defer();
var resolved = false;

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

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

//Check event
setTimeout(function(){
  if(!resolved){
    if ($window.cordova) d.resolve($window.cordova);
  }
}, 3000);

return self;
}]);

然后是我的App.js文件：

angular
.module('angularCordovaApp', [
'ngAnimate',
'ngAria',
'ngCookies',
'ngMessages',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch'
])
.config(function ($routeProvider) {
$routeProvider
  .when('/', {
    templateUrl: 'views/main.html',
    controller: 'MainCtrl',
    controllerAs: 'main'
  })
  .otherwise({
    redirectTo: '/'
  });
});

由于我刚刚构建了应用程序，因此还没有那么多模块。最后一个是主控制器：

angular.module('angularCordovaApp')
.controller('MainCtrl', ['$scope', 'cordova', function($scope, cordova)
{
  cordova.ready.then(function(){
    Notification.alert('Cordova is ready');
    window.location = 'https://staging.hopeelc.com.au/dashboard/';
  });
}]);

Index.html查看包含的脚本：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous" />

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-animate.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-aria.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-cookies.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-messages.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-resource.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-route.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-sanitize.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-touch.min.js"></script>



<!-- endbower -->
<!-- endbuild -->

<script>
  angular.element(document).ready(function () {
    if (window.cordova) {
      console.log("Running in Cordova, will bootstrap AngularJS once 'deviceready' event fires.");
      document.addEventListener('deviceready', function () {
        console.log("Deviceready event has fired, bootstrapping AngularJS.");
        angular.bootstrap(document.body, ['app']);
      }, false);
    } else {
      console.log("Running in browser, bootstrapping AngularJS now.");
      angular.bootstrap(document.body, ['app']);
    }
  });
</script>

    <!-- build:js({.tmp,app}) scripts/scripts.js -->
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>
    <script src="scripts/services/cordova.js"></script>
    <!-- endbuild -->

I would simply like to find a solution to why my module is not loading properly.

Answer 1

我认为问题是由于缺少ngRoute模块的包含。从版本1.1.6开始，它是一个单独的部分：Have a look here 尝试添加并重建它

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>

var app = angular.module（＆＃39; myapp＆＃39;，[＆＃39; ngRoute＆＃39;]）;

使用Cordova

1 个答案: