Controller is undefined in ui router

Question

I dont understand why TestCntrl is undefined when I run this. I already have an existing controller (MainCntrl) in the parent and now I want the child to have its own controller (TestCntrl).

(function() {
  'use strict';
  angular
    .module('app')
      .config(function ($stateProvider, $urlRouterProvider, $urlMatcherFactoryProvider) {

        $urlMatcherFactoryProvider.strictMode(false);
        $urlRouterProvider.when('/', '/search'); 
        $urlRouterProvider.when('/search/name', '/search');

        $urlRouterProvider.otherwise('/');

        $stateProvider
            .state('index', {
              url: '/',
              abstract: true,

              templateUrl: 'app/layout/layout.html',
              controller: 'MainController',
              controllerAs: 'main'

            })

            .state('index.layout', {

                initFactory2: ['initFactory', function(initFactory) {

                    return initFactory.getClasses().then(function(data) {
                        return data.data;
                    });
                }]

              },
              url: 'search',
              views: {

                'form@index': {
                  templateUrl: 'app/partials/form.html',
                  controller: 'TestController as test'
},
                'results@index':{}
              }
            })
})();

TestController

(function () {
    'use strict';

    angular
        .module('app')
        .controller('TestController', TestController);

    /** @ngInject */
    function TestController($scope, $stateParams, $state, model,
                             initFactory2) {
        var vm = this;

        vm.$scope = $scope;
    }
 });

Main Controller

(function () {
    'use strict';

    angular
        .module('app')
        .controller('MainController', MainController);

    /** @ngInject */
    function MainController($scope, $stateParams, $state, $timeout, model,
                            SearchFactory) {
        var vm = this;
    }
})();

This is the error I'm getting:

Error: [ng:areq] Argument 'TestController' is not a function, got undefined
http://errors.angularjs.org/1.3.17/ng/areq?p0=TestController&p1=not%20a%20function%2C%20got%20undefined

Are the parenthesis at the end of the TestController missing from your actual code or is that just a copy-paste error? — Matthew Green
– Matthew Green, Commented Aug 11, 2015 at 13:37
@MatthewGreen youre right. I added it to my code and that did the trick. Feel free to answer and I'll accept as answer. — gerl
– gerl, Commented Aug 11, 2015 at 14:12
If that was actually the issue you may want to roll back your edit so that people can see what the original issue was. Without it the answer looks a little out of place. — Matthew Green
– Matthew Green, Commented Aug 11, 2015 at 14:15

Matthew Green · Accepted Answer · 2015-08-11 14:14:09Z

1

You are missing your parenthesis at the end of your IIFE on your TestController. That is needed to properly declare it as function to be executed. Without it, your code for the TestController is never called and therefore never instantiated.

answered Aug 11, 2015 at 14:14

Matthew Green

10.4k4 gold badges40 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

manish · Accepted Answer · 2015-08-11 14:01:29Z

the problem is with your TestController

(function () {
'use strict';

   angular
    .module('app')
    .controller('TestController', TestController);

  /** @ngInject */
  function TestController($scope, $stateParams, $state, model, initFactory2) {
    var vm = this;
    vm.$scope = $scope;
   }
});

just, try reversing the order

(function () {
 'use strict';
  /** @ngInject */
  var TestController = function TestController($scope, $stateParams, $state, model, initFactory2){
    var vm = this;
    vm.$scope = $scope;
  };
  angular
    .module('app')
    .controller('TestController', TestController);
});

Collectives™ on Stack Overflow

Controller is undefined in ui router

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related