Question

113

Angularjs Uncaught Error: [$injector:modulerr] when migrating to V1.3

rated 0 times [ 120] [ 7] / answers: 1 / hits: 61194 / 9 Years ago, wed, february 25, 2015, 12:00:00

I am learning Angular.js and I am not able to figure out whats wrong with this simple code. It seems to look fine but giving me following 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)

And before adding ng-app=app (I was just keeping it as ng-app) it was giving me following errors. Why is that?

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>

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

loganl

Add To Favorites

Follow

Total Points: 424

Total Questions: 86

Total Answers: 112

Location: Zimbabwe

Member since Thu, Jul 21, 2022

2 Years ago

loganl questions

1 Is there an easier way to display live time and date in HTML using bootstrap?

Fri, Apr 17, 20, 00:00, 4 Years ago

1 Angular View Component Data Loss during Reload Refresh using BehaviorSubject

Tue, Mar 24, 20, 00:00, 4 Years ago

1 What is the best way to use async/await inside onAuthStateChanged() of Firebase?

Thu, Jun 13, 19, 00:00, 5 Years ago

1 'Symbol' is undefined in IE 11

Sun, Apr 14, 19, 00:00, 5 Years ago

1 CSS: Add border with animation left to right | right to left

Thu, Feb 21, 19, 00:00, 5 Years ago

View All

answered 9 Years ago elians · Accepted Answer

After AngularJS version 1.3 global controller function declaration is disabled

You need to first create an AngularJS module & then attach all the components to that specific module.

CODE

function Ctrl($scope) {

    $scope.age = 24;

}



angular.module('app', [])

    .controller('Ctrl', ['$scope', Ctrl]);

Specifically for your case, there is some issue with AngularJS 1.3.14 (downgrade it to 1.3.13 works fine). Though I'd prefer you to use ~~angular 1.2.27~~ AngularJS 1.6.X, Which is more stable version & latest release of AngularJS.

Working Plunkr

UPDATE:

You could do your current code to working state by allow global controller declaration inside angular.config. But this isn't the correct way to run angular application.

function Ctrl($scope) {

    $scope.age = 24;

}



angular.module('app', [])

    .config(['$controllerProvider',

        function ($controllerProvider) {

            $controllerProvider.allowGlobals();

        }

    ]);