AngularJS 1.2 $injector:modulerr

Question

Wenn Sie anstelle von 1.07 Angular 1.2 verwenden, ist das folgende Code-Stück nicht mehr gültig, warum?

'use strict';

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

app.config(['$routeProvider', '$locationProvider',
    function($routeProvider, $locationProvider) {
        $locationProvider.html5Mode(true);
        $routeProvider.
        when('/', {
            templateUrl: 'part.html',
            controller: 'MyCtrl'
        }).
        otherwise({
            redirectTo: '/'
        });
    }
]);

Das Problem liegt im Konfigurationsteil des Injectors (app.config):

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.0rc1/$injector/modulerr?p0=muninn&p1=Error%…eapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.0rc1%2Fangular.min.js%3A31%3A252) 

Wenn ich mich richtig erinnere, begann dieses Problem mit Angular 1.1.6.

Answer 1

Das Problem wurde durch das Fehlen der Einbindung des ngRoute-Moduls verursacht. Seit Version 1.1.6 ist es ein separater Teil:

var app = angular.module('myapp', ['ngRoute']);

Answer 2

Mein Fehler verschwand, als ich dieses '()' am Ende hinzufügte

(function(){
    var home = angular.module('home',[]);

    home.controller('QuestionsController',function(){
        console.log("Controller initialisiert");
        this.addPoll = function(){
            console.log("innerhalb der Funktion");
        };
    });
})();

Answer 3

Noch etwas, das auf die Liste hinzugefügt werden muss, da dies das erste Ergebnis ist, das bei einer Google-Suche nach 'Error: [$injector:modulerr] angular' angezeigt wird:

Wenn es einen Unterschied zwischen dem App-Namen in Ihrem 'index.html' und in der Haupt-Javascript-App-Definition gibt, kann dies auch diesen Fehler verursachen.

Zum Beispiel sieht Ihr HTML so aus:

        Über meine Webseite...

        und so weiter ...

Und Ihr JavaScript sieht so aus (zum Beispiel mit einem Tippfehler im App-Namen - myWebCite anstelle von myWebSite):

/** Haupt-AngularJS-Webanwendung */
var app = angular.module('myWebCite', [ 'ngRoute' ]);

/** Konfigurieren der Routen */
app.config(['$routeProvider', function ($routeProvider) {
  und so weiter ...

dann wird auch der Fehler 'Error: [$injector:modulerr] angular' erzeugt.

Answer 4

Ein Anfängerfehler kann sein, das Modul js nicht einzubinden

in der index.html überhaupt nicht

Answer 5

Für diejenigen, die Frameworks verwenden, die Dateien komprimieren, bündeln und minimieren, stellen Sie sicher, dass Sie jede Abhängigkeit explizit definieren, da diese Frameworks dazu neigen, Ihre Variablen umzubenennen. Das ist mir passiert, als ich ASP.NET BundleConfig.cs verwendet habe, um meine App-Skripte zu bündeln.

Vorher

app.config(function($routeProvider) {
    $routeProvider.
      when('/', {
          templateUrl: 'list.html',
          controller: 'ListController'
      }).
      when('/items/:itemId', {
          templateUrl: 'details.html',
          controller: 'DetailsController'
      }).
      otherwise({
          redirectTo: '/'
      });
});

Nachher

app.config(["$routeProvider", function($routeProvider) {
    $routeProvider.
      when('/', {
          templateUrl: 'list.html',
          controller: 'ListController'
      }).
      when('/items/:itemId', {
          templateUrl: 'details.html',
          controller: 'DetailsController'
      }).
      otherwise({
          redirectTo: '/'
      });
}]);

Lesen Sie hier mehr über Angular Dependency Annotation.