从AngularJS 1.2升级到1.3后$ injector:modulerr

时间:2015-02-25 10:28:54

标签: javascript angularjs

我从AngularJS 1.2.28升级到1.3.10并收到以下错误:

Failed to instantiate module ng due to:
Error: [$injector:modulerr] http://errors.angularjs.org/1.3.10/$injector/modulerr?p0=...)
    at Error (native)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:6:417
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:36:98
    at s (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:7:302)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:35:202)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:35:371
    at s (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:7:302)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:35:202)
    at Ob (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:38:435)
    at d (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:17:350

在阅读迁移指南时,我发现此错误通常是由于未作为单独模块加载的ngRoute引起的。但是,由于我已经在1.2上运行,我已经在HTML中加载了ngRoute:

// load all of the dependencies asynchronously.
$script([
  '//ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js',
  '//ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular-route.min.js',
  'bower_components/angular-cookie/angular-cookie.min.js',
  'app.js',
  'home/home.js',
  'users/users.js',
  'courses/courses.js',
  'quizzes/quizzes.js',
  'quizzes-list/quizzes-list.js',
  'components/version/version.js',
  'components/version/version-directive.js',
  'components/version/interpolate-filter.js',
  'components/notifications/notifications-factory.js'
], function() {
  // when all is done, execute bootstrap angular application
  angular.bootstrap(document, ['kVoc']);
});

在app.js中:

(function() {
  'use strict';

  // Declare app level module which depends on views, and components
  angular.module('kVoc', [
    'ngRoute',
    'ipCookie',
    'kVoc.version',
    'kVoc.notifications',
    'kVoc.home',
    'kVoc.users',
    'kVoc.courses',
    'kVoc.quizzes',
    'kVoc.quizzesList'
  ])

  .config(['$routeProvider', function($routeProvider) {
    $routeProvider.otherwise({redirectTo: '/home'});
  }])

  .controller('NotificationsController', ['$rootScope', 'notificationsFactory', function($rootScope, NotificationsFactory) {
    var ctrl = this;
    this.info = NotificationsFactory.getInfo();
    this.error = NotificationsFactory.getError();

    $rootScope.$on('notificationsFactory.update', function () {
      ctrl.info = NotificationsFactory.getInfo();
      ctrl.error = NotificationsFactory.getError();
    });
  }])

  .value('selectedCourse', {
    id: undefined
  })

  .factory('userCookieHandler', [
    'ipCookie',
    function(ipCookie) {
      return {
        getCookie: function() {
          return {
            userId: ipCookie('userId'),
            userEmail: ipCookie('email'),
            userFirstName: ipCookie('firstName')
          }
        },

        setCookie: function(id, email, firstName) {
          ipCookie('userId', id, { expires: 730 });
          ipCookie('userEmail', email, { expires: 730 });
          ipCookie('userFirstName', firstName, { expires: 730 });
        },

        userIsRegistered: function () {
          if (typeof this.getCookie().userId === 'undefined') {
            return false;
          } else {
            return true;
          }
        }
      }
    }
  ])

  // Angular's ng-change, ng-keyup and $scope.$watch don't get triggered
  // while composing (e.g. when writing Korean syllables).
  // See: https://github.com/angular/angular.js/issues/10588
  // This custom directive uses element.on('input') instead, which gets
  // triggered while composing.
  .directive('cstInput', function() {
    return {
      restrict: 'A',
      require: '^ngModel',
      link: function (scope, element, attrs, ngModel) {
        element.bind('input', function() {
          //if (event.which === 13) { return; }
          scope.$apply(function(){
            scope.ngModel = element.val();
            scope.$eval(attrs.cstInput, {'answer': scope.ngModel}); // only works if no scope has been defined in directive
          });
        });
      }
    };
  })

  // http://stackoverflow.com/questions/15417125/submit-form-on-pressing-enter-with-angularjs
  .directive('cstEnter', function() {
    return {
      restrict: 'A',
      link: function(scope, element, attrs) {
        element.bind("keydown keypress", function(event) {
          if(event.which === 13) {
            scope.$apply(function(){
              scope.$eval(attrs.cstEnter, {'event': event});
            });
            event.preventDefault();
          }
        });
      }
    };
  });

})();

我需要做些什么来实现这个目标?

0 个答案:

没有答案