Controller function defined but not catched by angularjs

Question

I have a plunk @ http://plnkr.co/edit/VnFmKqnFh0vOFARvIgVB?p=preview

(function () {
    'use strict';

    angular
        .module('app')
        .controller('MainController', MainController);
 MainController.$inject = ['DataService', '$rootScope', '$scope', 'timeFilterValues', '$localStorage'];
    function MainController(DataService, $rootScope, $scope, timeFilterValues, $localStorage) {

        var vm = this;

        vm.currentFilter = {
            selections: $localStorage.getObject('currentSelections') || [],
            vendors: $localStorage.getObject('currentVendors') || [],
            segments: $localStorage.getObject('currentSegments') || [],
            units: $localStorage.getObject('currentUnits') || [],
            categories: $localStorage.getObject('currentCategories') || [],
            classes: $localStorage.getObject('currentClasses') || [],
            years: $localStorage.getObject('currentYears') || {},
            buyers: $localStorage.getObject('currentBuyers') || [],
            evp: $localStorage.getObject('currentEvp') || [],
            quarters: $localStorage.getObject('currentQuarters') || [],
            months: $localStorage.getObject('currentMonths') || []
        };

        vm.vendors = $localStorage.getObject('vendors') || [];
        vm.segments = $localStorage.getObject('segments') || [];
        vm.categories = $localStorage.getObject('categories') || [];
        vm.units = $localStorage.getObject('units') || [];
        vm.buyers = $localStorage.getObject('buyers') || [];
        vm.evp = $localStorage.getObject('evp') || [];
        vm.defaultSelections = $localStorage.getObject('selections') || [];

        vm.years = timeFilterValues.years;
        vm.quarters = timeFilterValues.quarters;
        vm.months = timeFilterValues.months;

        vm.filterData = new Object();
        vm.filterData.vendors = $localStorage.getObject('selectedVendors') || '';
        vm.filterData.segments = $localStorage.getObject('selectedSegments') || '';
        vm.filterData.categories = $localStorage.getObject('selectedCategories') || '';
        vm.filterData.units = $localStorage.getObject('selectedUnits') || '';
        vm.filterData.buyers = $localStorage.getObject('selectedBuyers') || '';
        vm.filterData.evp = $localStorage.getObject('selectedEvp') || '';
        vm.filterData.date_start = $localStorage.getObject('selectedDateStart') || '';
        vm.filterData.date_end = $localStorage.getObject('selectedDataEnd') || '';
        vm.filterData.route = $localStorage.getObject('selectedRoute') || '';
        vm.filterData.currentToggle = $localStorage.getObject('currentToggle') || 'segments';
        vm.filterData.crossToggle = $localStorage.getObject('crossToggle') || 'evp';
        vm.filterData.years = $localStorage.getObject('selectedYears') || '';
        vm.filterData.quarters = $localStorage.getObject('selectedQuarters') || '';
        vm.filterData.months = $localStorage.getObject('selectedMonths') || '';

        vm.filterData.subroute = undefined;



    }

})();

where a controller is been defined and used further but I'm stuck at finding this controller where it gives this error

Error: [ng:areq] Argument 'MainController' is not a function, got undefined http://errors.angularjs.org/1.4.4/ng/areq?p0=MainController&p1=not%20a%20function%2C%20got%20undefined at REGEX_STRING_REGEXP (angular.js:68) at assertArg (angular.js:1795) at assertArgFn (angular.js:1805) at angular.js:9069 at setupControllers (angular.js:8133) at nodeLinkFn (angular.js:8173) at compositeLinkFn (angular.js:7637) at compositeLinkFn (angular.js:7641) at publicLinkFn (angular.js:7512) at angular.js:1660 as error

It might have something to do with you trying to $inject inside of the function body. Try moving it outside and see if that helps. — ach
– ach, Commented Sep 7, 2015 at 20:20
Obvious guess but this was a mistake by this stackoverflow copy paste code and the ctrl + k moves some lines up and down for reasons unknown. — user2779417
– user2779417, Commented Sep 8, 2015 at 6:12

ste2425 · Accepted Answer · 2015-09-08 07:09:40Z

0

I believe it is your d3.js.

You've defined your app and it's dependencies in script.jshowever in d3.js you've added the empty array when accessing the module, removing this fixes the issue.

so in d3.js from

angular.module('app', [])
        .factory('d3Service'...

to

angular.module('app')
        .factory('d3Service'...

I think angular thinks you are re-defining your application. As the main controller is defined before d3.js i assume angular deletes it, then the ng-controller directive is looking for something that isn't there.

answered Sep 8, 2015 at 7:09

ste2425

4,8473 gold badges26 silver badges39 bronze badges

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

1 Comment

ste2425 Over a year ago

Brilliant, if that fixed it would you accept the answer?

Collectives™ on Stack Overflow

Controller function defined but not catched by angularjs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related