Controller Not a Function, Got Undefined, While Defining Controllers Globally

Controller not a function, got undefined, while defining controllers globally

With Angular 1.3+ you can no longer use global controller declaration on the global scope (Without explicit registration). You would need to register the controller using module.controller syntax.

Example:-

angular.module('app', [])
    .controller('ContactController', ['$scope', function ContactController($scope) {
        $scope.contacts = ["abcd@gmail.com", "abcd@yahoo.co.in"];

        $scope.add = function() {
            $scope.contacts.push($scope.newcontact);
            $scope.newcontact = "";

        };
    }]);

or

function ContactController($scope) {
    $scope.contacts = ["abcd@gmail.com", "abcd@yahoo.co.in"];

    $scope.add = function() {
        $scope.contacts.push($scope.newcontact);
        $scope.newcontact = "";
    };
}
ContactController.$inject = ['$scope'];
angular.module('app', []).controller('ContactController', ContactController);

It is a breaking change but it can be turned off to use globals by using allowGlobals.

Example:-

angular.module('app')
    .config(['$controllerProvider', function($controllerProvider) {
        $controllerProvider.allowGlobals();
    }]);

Here is the comment from Angular source:-

• check if a controller with given name is registered via $controllerProvider
• check if evaluating the string on the current scope returns a constructor
• if $controllerProvider#allowGlobals, check window[constructor] on the global window object (not recommended)

 .....

expression = controllers.hasOwnProperty(constructor)
            ? controllers[constructor]
            : getter(locals.$scope, constructor, true) ||
                (globals ? getter($window, constructor, true) : undefined);

Some additional checks:-

• Do Make sure to put the appname in ng-app directive on your angular root element (eg:- html) as well. Example:- ng-app="myApp"

• If everything is fine and you are still getting the issue do remember to make sure you have the right file included in the scripts.

• You have not defined the same module twice in different places which results in any entities defined previously on the same module to be cleared out, Example angular.module('app',[]).controller(.. and again in another place angular.module('app',[]).service(.. (with both the scripts included of course) can cause the previously registered controller on the module app to be cleared out with the second recreation of module.

AngularJS controller is not a function, got undefined when using typescript type

Ok, so your problem is the way your files get loaded.

Move your controller registration with Angular down after the definition of your class and it will work just fine.

class BeerController {
   ...
}

angular.module("beerApp", []).controller("beerController", BeerController);

If you have these definitions in seperate files I suggest you move the module definition to single file and only register your controller in the controller file as below.

app.js

angular.module("beerApp", []);

beerController.ts

class BeerController {
   ...
}

angular.module("beerApp").controller("beerController", BeerController);

See this running JSFiddle

controller is not a function got undefined when defining controller in site provider

You need to link both the App.js and Controller. In your service:

angular.module('values', ['controllerinject']) // => here you injected your controller

.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('home', {
      url: '/home',
      templateUrl: '/app/views/showusers.html',
      controller: 'Crud'
    })
  $urlRouterProvider.otherwise('/home');
})

And in your controller add same angular.module('controllerinject', [])

Controller error: Argument is not a function, got undefined

You are basically defining controller as part of edisoncatControllers app.
Change the controller definition to below:

edisoncatApp.controller('ModuleModalCtrl', ['$scope',
function($scope) {
    $scope.showModal = false;
    $scope.toggleModal = function(){
    $scope.showModal = !$scope.showModal;
    };
}]);

In addition to this, the HTML seems broken too. div tag with class=container needs to close.

<div ng-controller="ModuleModalCtrl" class="container">
    <h1>Modal example</h1>
    <button ng-click="toggleModal()" class="btn btn-default">Open modal</button>
</div>

still getting Controller not a function, got undefined, while I'm not defining controller globelly

There are no controller name AveragesCtrl

Your declared a controller name AvengersCtrl

Convert this

<div ng-controller="AveragesCtrl">

to

<div ng-controller="AvengersCtrl">

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

This creates a new module/app:

var myApp = angular.module('myApp',[]);

While this accesses an already created module (notice the omission of the second argument):

var myApp = angular.module('myApp');

Since you use the first approach on both scripts you are basically overriding the module you previously created.

On the second script being loaded, use var myApp = angular.module('myApp');.

AngularJS - Error controller is not a function, got undefined

You probably forgot to add the script tag to define your controller within the html.

for example:

<script src="yourController.js"></script>

Argument 'controller' is not a function, got undefined

Your module app-praiana needs to have access to the app-praiana.controllers module in order to use its initioController.

First define the controller module, and then to declare your main module do:

angular.module('app-praiana', ['ionic', 'ngCordova', 'app-praiana.controllers'])

---

Related Topics