javascript - ejemplos - angularjs tutorial

AngularJS 1.2 $ inyector: modulerr

Question

Cuando se usa angular 1.2 en lugar de 1.07, el siguiente fragmento de código ya no es válido, ¿por qué?

''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: ''/''
        });
    }
]);

el problema está en la parte de configuración del inyector (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) 

Si recuerdo correctamente este problema comenzó con angular 1.1.6.

Answer 1

Acabo de experimentar el mismo error, en mi caso fue causado por la angular.module del segundo parámetro en angular.module espero que esto pueda ayudar a alguien con el mismo problema.

angular.module(''MyApp'');

angular.module(''MyApp'', []);

Answer 2

Además de la respuesta a continuación, si tiene este error en la consola ( [$injector:nomod] , MINERR_ASSET:22 ), pero parece que todo funciona bien, asegúrese de que no tiene duplicados incluidos en su index.html.

Debido a que este error también puede producirse si tiene duplicados de inclusión de los archivos, que utilizan este módulo, y se incluyen antes del archivo con la declaración del módulo real.

Answer 3

Después de muchos meses, volví a desarrollar una aplicación AngularJS ( 1.6.4 ), para la que elegí Chrome (PC) y Safari (MAC) para realizar pruebas durante el desarrollo. Este código presentó este error: $ inyector: modulerr Error de módulo en IE 11.0.9600 (Windows 7, 32 bits).

Tras la investigación, quedó claro que el error se debía a que forEach se utilizaba, simplemente se reemplazaron todos los bucles forEach con normales para que las cosas funcionen como están ...

Básicamente era un problema de IE11 (se responde here ) en lugar de un problema de AngularJS, pero quiero poner esta respuesta aquí porque la excepción fue una excepción de AngularJS. Espero que ayude a algunos de nosotros allí.

similar. no use las funciones lambda ... simplemente reemplace () => {...} con una buena función ol ''() {...}

Answer 4

El problema fue causado por la falta de inclusión del módulo ngRoute. Desde la versión 1.1.6 es una parte separada:

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

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

Answer 5

En algún momento he visto este error cuando está cambiando entre los proyectos y ejecutando los proyectos en el mismo puerto, uno tras otro. En ese caso, vaya a Chrome Developer Tools> Network e intente verificar el archivo js escrito real para ver if the file match with the workspce . Para resolver esto, seleccione Disable Cache en la red.

Answer 6

Es un error del inyector. Es posible que tenga que usar muchos archivos JavaScript para que falte el inyector.

Algunos están aquí:

var app = angular.module(''app'', 
    [''ngSanitize'', ''ui.router'', ''pascalprecht.translate'', ''ngResource'', 
     ''ngMaterial'', ''angularMoment'',''md.data.table'', ''angularFileUpload'', 
     ''ngMessages'', ''ui.utils.masks'', ''angular-sortable-view'',          
     ''mdPickers'',''ngDraggable'',''as.sortable'', ''ngAnimate'', ''ngTouch'']
);

Por favor verifique el inyector que necesita insertar en su app.js

Answer 7

John Papa proporcionó mi problema en this comentario bastante oscuro: a veces, cuando se produce ese error, significa que falta un archivo. Otras veces significa que el módulo se definió después de que se usó. Una forma de resolver esto fácilmente es nombrar los archivos del módulo * .module.js y cargarlos primero.

Answer 8

Mi problema estaba en el config.xml. Cambiando:

<access origin="*" launch-external="yes"/>

a

<access origin="*"/>

arreglado.

Answer 9

Otro disparador para este error es dejar el "." antes de su "de lo contrario" o cualquier otra ruta en su definición de ruta:

  app.config([''$routeProvider'',
     function($routeProvider) {
        $routeProvider.
           when(''/view1'', {
              templateUrl: ''partials/view1.html'',
              controller: ''Ctrl1''
           }).
           otherwise({
              redirectTo: ''/viewCounts''
           });
     }]);

Mortificado por una parada completa, una vez más. Tengo que amar a JS!

Answer 10

Para aquellos que utilizan marcos que comprimen, agrupan y minimizan archivos, asegúrese de definir cada dependencia explícitamente, ya que estos marcos tienden a cambiar el nombre de sus variables. Eso me sucedió mientras utilizaba ASP.NET BundleConfig.cs para agrupar mis scripts de aplicaciones.

antes de

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

Después

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

Lea más aquí sobre Anotación de dependencia angular.

Answer 11

Si sigue el tutorial oficial de angularjs https://docs.angularjs.org/tutorial/step_07

Nota: Comenzando con AngularJS versión 1.2, ngRoute está en su propio módulo y debe cargarse cargando el archivo adicional angular-route.js, que descargamos a través de Bower arriba.

También tenga en cuenta que desde la API de ngRoute link

Instalación Primero incluya angular-route.js en su HTML:

Puedes descargar este archivo desde los siguientes lugares:

Google CDN, por ejemplo, //ajax.googleapis.com/ajax/libs/angularjs/XYZ/angular-route.js Bower, por ejemplo, bower install angular-route @ XYZ code.angularjs.org, por ejemplo, //code.angularjs.org/XYZ/ angular-route.js "donde XYZ es la versión de AngularJS que está ejecutando.

Luego, cargue el módulo en su aplicación agregándolo como un módulo dependiente:

angular.module (''app'', [''ngRoute'']); Con eso estás listo para empezar!

Answer 12

Si tiene este error en la consola ([$injector:nomod], MINERR_ASSET:22) , asegúrese de no incluir el código de su aplicación antes de cargar AngularJS

Estaba haciendo eso y una vez arreglado el pedido, el error desapareció.

Answer 13

Tuve el mismo problema y probé todas las soluciones posibles. Pero finalmente llegué a saber de la documentación que el módulo ngRoute ahora está separado. Echa un vistazo a este link

Solución: Agregue el cdn angular-route.js después del script angular.min.js

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

Answer 14

Un error de noob puede olvidarse de incluir el módulo js

<script src="app/modules/myModule.js"></script>

archivos en el index.html en absoluto

Answer 15

Una cosa más para agregar a la lista, ya que este es el primer resultado que aparece con una búsqueda en Google de ''Error: [$ injector: modulerr] angular'':

Si tiene una discrepancia entre el nombre de su aplicación en su ''index''html'' y en la definición de la aplicación principal de JavaScript, esto también puede generar este error.

Por ejemplo, si su HTML se ve así:

    </head>
    <body ng-app="myWebSite">

        <!-- My Web Site -->
        <p>About my web site...</p>

        etc ...

Y su JavaScript tiene este aspecto (es decir, tiene un error tipográfico en el nombre de la aplicación: myWebCite en lugar de myWebSite):

/** Main AngularJS Web Application */ 
var app = angular.module(''myWebCite'', [ ''ngRoute'' ]); 

/** Configure the Routes */ 
app.config([''$routeProvider'', function ($routeProvider) { 
  etc ...

entonces también se generará el error ''Error: [$ injector: modulerr] angular''.

Answer 16

mi error desapareció al agregar este ''()'' al final

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

    home.controller(''QuestionsController'',function(){
        console.log("controller initialized");
        this.addPoll = function(){
            console.log("inside function");
        };
    });
})();

Answer 17

add to link
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular-route.min.js"></script>

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