javascript - dependency - Error de Angularjs no detectado:[$ injector: modulelerr] al migrar a V1.3
service and controller in angularjs (4)
Asegúrese de que
ng-app="app_name"
define debe coincidir con
var app=angular.module(
''app_name''
,[])
<html ng-app="myApp">
<body>
<div ng-controller="Ctrl">
<input ng-model="name">
<h1>{{name}}</h1>
<h2>{{age}}</h2>
</div>
<script>
var app = angular.module(''myApp'',[]); // same to the above define appName
app.controller(''Ctrl'',function($scope){
$scope.age=24; // initialize age by injecting scope
});
</script>
</body>
<html>
Para más detalles visite Here
Estoy aprendiendo Angular.js y no puedo entender qué hay de malo con este código simple. Parece verse bien pero me da el siguiente error.
**Error**: Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=app&p1=Error%3A%20…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A17%3A381)
Y antes de agregar
ng-app=
"app"
(solo lo mantenía como
ng-app
) me daba los siguientes errores.
¿Porqué es eso?
Error: [ng:areq] http://errors.angularjs.org/1.3.14/ng/areq?p0=Ctrl&p1=not%20a%20function%2C%20got%20undefined
at Error (native)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:6:417
at Sb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:19:510)
at tb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:20:78)
at $get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:75:331)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:57:65
at s (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:7:408)
at A (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:56:443)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:299)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)
<!doctype html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body>
<div ng-controller="Ctrl">
<input ng-model="name">
<h1>{{name}}</h1>
<h2>{{age}}</h2>
</div>
<script>
var Ctrl = function($scope)
{
$scope.age = 24;
};
</script>
</body>
</html>
Después de que la declaración de la función del controlador global AngularJS versión 1.3 esté deshabilitada
Primero debe crear un módulo AngularJS y luego conectar todos los componentes a ese módulo específico.
CÓDIGO
function Ctrl($scope) {
$scope.age = 24;
}
angular.module(''app'', [])
.controller(''Ctrl'', [''$scope'', Ctrl]);
Específicamente para su caso, hay algún problema con AngularJS
1.3.14
(rebajarlo a
1.3.13
funciona bien).
Aunque prefiero que uses AngularJS 1.6.X
angular 1.2.27
, que es la versión más estable y la última versión de AngularJS.
ACTUALIZAR:
Puede hacer su código actual al estado de trabajo permitiendo la declaración global del controlador dentro de
angular.config
.
Pero esta no es la forma correcta de ejecutar la aplicación angular.
function Ctrl($scope) {
$scope.age = 24;
}
angular.module(''app'', [])
.config([''$controllerProvider'',
function ($controllerProvider) {
$controllerProvider.allowGlobals();
}
]);
Tienes que definir tu controlador
var app = angular.module(''app'', []);
app.controller(''Ctrl'', [''$scope'',function($scope) {
$scope.age = 24;
}]);
Yo mismo estuve atrapado en este problema por algún tiempo. Verifique lo siguiente en orden: -
-
La ruta hacia el script angular.js es correcta (ya sea que la esté llamando en su HTML desde una fuente local o como un recurso externo).
-
A continuación, una vez que su angular.js esté correcto, verifique si su aplicación está inicializada o no.
var app=angular.module(''app'',[])// en su archivo app.js<body ng-app="app">// en tu html -
Luego registre su controlador con la aplicación y pase todas las inyecciones necesarias
app.controller(''myCtrl'',function(){}); -
Llame a su archivo javascript en su archivo html
<script src="app.js"></script>