How to Find a Reason Angularjs "Argument 'Myctrl' Is Not a Function, Got Undefined"

How to find a reason AngularJS Argument 'MyCtrl' is not a function, got undefined

Is file with 'MyCtrl' connected via html? (check twice if you concat or uglify your files)

<script src='path/to/controllers.js'></script>

Is 'MyCtrl' defined correctly?

There are a few patterns:

app.controller('MyCtrl', ['$scope', function ($scope) {...}])

app.controller('MyCtrl', function ($scope) {...})

var MyCtrl = function ($scope) {...})

Is 'MyCtrl' defined in right module?
Is "MyCtrl's" module added to app dependencies?

angular.module('app', ['app.sources']);

If you define your module multiple times, you should define it in this order:
- First define should be like

angular.module('app.sources', []);

(with [ ])

Subsequent defines should be like

angular.module('app.sources');

(without [ ])

Important: Declaration order is important - definition with [ ] should go first.

Check that module is defined only once.
You may have forgotten to rename module after copy-paste. Check src for string like

angular.module('app.sources', []);

Check your 'ng-app'. Better to use only one of these with name like ng-app='app' (In other words do not define multiple unnamed ngApp directives)
Is your controller's syntax correct for your AngularJS version?

(There is a difference between definition in Angular 1.0.x and 1.2.x and higher. With Angular versions greater than 1.3.x, you cannot declare a global constructor function and use it with ng-controller)

Error: [ng:areq] Argument 'MyCtrl' is not a function, got undefined

Turns out I had and the following html tag in the layout page which was returning this error

<html lang="en ng-app">

Removed the ng-app from the tag and code works perfectly

Getting error - Argument 'myCtrl' is not a function, got undefined

The error has to do with how the app is initialised and the double ng-app. You can easily verify that by bootstrapping angularjs manually:

When you remove both ng-app and add the following snippet at the bottom at controllers/controller.js, your script works:

angular.element(document).ready(function() { angular.bootstrap(document, ['myApp']); });

Argument '' is not a function got undefined angularjs

Here is your own code. Please go through it and for more just go to plunker

 //JS code
    var app = angular.module('myApp', [])
    .controller('AppController', function($scope) {
        $scope.data = 'Hello';
    });

    //template code
        <div ng-app="myApp">
            <div ng-controller="AppController">
              <h1> {{data}}</h1>
           </div>
         </div>

Error: Argument is not a function, got undefined

Remove the [] from the name ([myApp]) of module

angular.module('myApp', [])

And add ng-app="myApp" to the html and it should work.

AngularJS: Argument 'Ctrl' is not a function, got undefined

As I know you need to define controller using module.controller method. For example, name your app as myApp

<html ng-app="myApp">

and the js part will be:

angular.module('myApp', [])
    .controller('Ctrl', ['$scope', function($scope) {
        $scope.name = "Noob";
        $scope.age = "21";
    }]);

AngularJS: Cannot find the reason for the following error: [ng:areq] Argument 'MyCtrl' is not a function, got undefined

You need to define angular module first then add that components like controller, directive, factory, etc. in it, then you need to add that module inside the ng-app directive.

Markup

<body ng-app="myApp">
   <div ng-controller="MyCtrl"> 
      <button ng-click="toggle()">Toggle</button> 
      <p ng-show="visible">Hello World!</p> 
   </div>
</body>

Code

angular.module('myApp', [])
.controller('MyCtrl', MyCtrl)
function MyCtrl($scope) {
   $scope.visible = true;
   $scope.toggle = function () {
      $scope.visible = !$scope.visible;
   }; 
};

Demo here

How to Find a Reason Angularjs "Argument 'Myctrl' Is Not a Function, Got Undefined"