Error no detectado de Angularjs: [$injector:modulerr] al migrar a V1.3
Estoy aprendiendo Angular.js y no puedo entender qué pasa 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 agregarlo (solo lo mantenía como ) me daba los siguientes errores. ¿Porqué es eso?ng-app="app"
ng-app
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 función del controlador global de AngularJS versión 1.3 esté deshabilitada
Primero debe crear un módulo AngularJS y luego adjuntar 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
(bájelo para que 1.3.13
funcione bien). Aunque preferiría que usaras angular 1.2.27 AngularJS 1.6.X, que es la versión más estable y la última versión de AngularJS.
Plunkr de trabajo
ACTUALIZAR:
Puede hacer que su código actual funcione al permitir la declaración del controlador global dentro angular.config
. Pero esta no es la forma correcta de ejecutar una aplicación angular.
function Ctrl($scope) {
$scope.age = 24;
}
angular.module('app', [])
.config(['$controllerProvider',
function ($controllerProvider) {
$controllerProvider.allowGlobals();
}
]);
Yo mismo estuve atrapado en este tema por algún tiempo. Verifique lo siguiente en orden: -
La ruta a su script angular.js es correcta (ya sea que lo llame en su HTML desde una fuente local o como un recurso externo).
A continuación, una vez que su angular.js sea correcto, verifique si su aplicación está inicializada o no.
var app=angular.module('app',[])
//en tu archivo app.js<body ng-app="app">
//en tu htmlLuego 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>
Tienes que definir tu controlador.
var app = angular.module('app', []);
app.controller('Ctrl', ['$scope',function($scope) {
$scope.age = 24;
}]);