AngularJS directive gives Unknown Provider Unknown

Question

When my modal loads in my AngularJS application, I get the following error:

$injector:unpr Unknown Provider Unknown provider: eProvider <- e

This is my directive:

(function () {

    angular.module('myApp').directive('ssdropdownmulti', [ssdropdownmulti]);

        function ssdropdownmulti() {

            return {
                restrict: 'E',
                scope: {
                    model: '=',
                    options: '=',
                    pre_selected: '=preSelected',
                    dropdownTitle: '@'
                },
                template : "<div class='btn-group' ng-class='{open: open}'>" +
                           "<button class='btn btn-small'>{{dropdownTitle}}</button>" +
                           "<button class='btn btn-small dropdown-toggle' ng-click='open=!open;openDropDown()'><span class='caret'></span></button>" +
                           "<ul class='dropdown-menu scrollable-menu' aria-labelledby='dropdownMenu'>" +
                           "<li><input type='checkbox' ng-change='checkAllClicked()' ng-model=checkAll> Check All</li>" +
                           "<li class='divider'></li>" +
                           "<li ng-repeat='option in options'><input type='checkbox' ng-change='setSelectedItem(option.id)' ng-model='selectedItems[option.id]'>{{option.name}}</li>" +
                           "</ul></div>",
                controller : function ($scope) {

                    ... other code...
        } // end constructor function
})();

This is my view html:

<ssdropdownmulti dropdown-title="Select Employees"
                 pre-selected="vm.plannedEmployees[0].id"
                 model="selected_items"
                 options="vm.plannedEmployees">

The code works fine however in this fiddle: http://jsfiddle.net/jab4raoq/336/

If you plan to minify your code, the controller function should avoid [implicit dependency injection](https://docs.angularjs.org/guide/di#implicit-annotation). `$scope` will get minified to something like `e`, which would create that error. — georgeawg, Mar 17 '18 at 17:05
Ah, the problem in the OP was in the controller. Still the syntax for the directive itself is incorrect. See my answer below. — Jelmer Jellema, Mar 18 '18 at 07:28

score -1 · Answer 1 · answered Mar 17 '18 at 16:55

It should be like this:

angular.module('myApp').directive('ssdropdownmulti', function ssdropdownmulti() {
..
});

The directive definition is not like an injection. If you do want to inject something in the function, it would be like:

angular.module('myApp').directive('ssdropdownmulti', 
       ['$timeout',function ssdropdownmulti($timeout) {
..
}]);

AngularJS directive gives Unknown Provider Unknown

1 Answers1