как исправить Угловое, не используя явное аннотирование и не может быть вызвано в строгом режиме

Я использую строгий режим и Angular 1.4.7, я получаю следующую ошибку:

Error: [$injector:strictdi] function($scope, $element, $attrs, mouseCapture) is not using explicit annotation and cannot be invoked in strict mode

Угловой код ошибки:

https://docs.angularjs.org/error/ $ injector/strictdi? p0 = function ($ scope, %20 $ element, %20 $ attrs, %20mouseCapture

И следующая услуга

angular.module('mouseCapture', [])

//
// Service used to acquire 'mouse capture' then receive dragging events while the mouse is captured.
//
.factory('mouseCapture', function ($rootScope) {

    //
    // Element that the mouse capture applies to, defaults to 'document' 
    // unless the 'mouse-capture' directive is used.
    //
    var $element = document; 

    //
    // Set when mouse capture is acquired to an object that contains 
    // handlers for 'mousemove' and 'mouseup' events.
    //
    var mouseCaptureConfig = null;

    //
    // Handler for mousemove events while the mouse is 'captured'.
    //
    var mouseMove = function (evt) {

        if (mouseCaptureConfig && mouseCaptureConfig.mouseMove) {

            mouseCaptureConfig.mouseMove(evt);

            $rootScope.$digest();
        }
    };

    //
    // Handler for mouseup event while the mouse is 'captured'.
    //
    var mouseUp = function (evt) {

        if (mouseCaptureConfig && mouseCaptureConfig.mouseUp) {

            mouseCaptureConfig.mouseUp(evt);

            $rootScope.$digest();
        }
    };

    return {

        // 
        // Register an element to use as the mouse capture element instead of 
        // the default which is the document.
        //
        registerElement: function(element) {

            $element = element;
        },

        //
        // Acquire the 'mouse capture'.
        // After acquiring the mouse capture mousemove and mouseup events will be 
        // forwarded to callbacks in 'config'.
        //
        acquire: function (evt, config) {

            //
            // Release any prior mouse capture.
            //
            this.release();

            mouseCaptureConfig = config;

            // 
            // In response to the mousedown event register handlers for mousemove and mouseup 
            // during 'mouse capture'.
            //
            $element.mousemove(mouseMove);
            $element.mouseup(mouseUp);
        },

        //
        // Release the 'mouse capture'.
        //
        release: function () {

            if (mouseCaptureConfig) {

                if (mouseCaptureConfig.released) {
                    //
                    // Let the client know that their 'mouse capture' has been released.
                    //
                    mouseCaptureConfig.released();
                }

                mouseCaptureConfig = null;
            }

            $element.unbind("mousemove", mouseMove);
            $element.unbind("mouseup", mouseUp);
        },
    };
})

//
// Directive that marks the mouse capture element.
//
.directive('mouseCapture', function () {
  return {
    restrict: 'A',

    controller: function($scope, $element, $attrs, mouseCapture) {

        // 
        // Register the directives element as the mouse capture element.
        //
        mouseCapture.registerElement($element);

    },
  };
})
;

Как исправить эту ошибку

Ответы

Ответ 1

Из документации видно, что вам нужно объявить все инъекции зависимостей в массиве строк.

Есть и другие способы, но обычно я делаю это так:

controller: ['$scope', '$element', '$attrs', 'mouseCapture',
  function($scope, $element, $attrs, mouseCapture) {
    ...
  }
]

Одна из причин, по которой мы это делаем, состоит в том, что, когда мы пытаемся минимизировать этот js файл, имена переменных будут уменьшены до одного или двух символов, а DI нуждается в точном имени, чтобы найти службы. Объявляя DI в строковом массиве, угловые могут сопоставлять службы с их минитипированным именем переменной. По этой причине массив строк и аргументы функции нуждаются в ТОЧНОМ СОГЛАШЕНИИ в количестве и порядке.


Обновить:

Если вы следуете руководству "Угловой стиль" Джона Папа, вы должны сделать это следующим образом:

controller: MouseCaptureController,
...

MouseCaptureController.$inject = ['$scope', '$element', '$attrs', 'mouseCapture'];

function MouseCaptureController($scope, $element, $attrs, mouseCapture) {
  ...
}

Ответ 2

В коде говорится:

$ Инжектор: strictdi

При инъекции зависимостей есть ошибка. В документации для этой ошибки:

Строгий режим выдает ошибку всякий раз, когда служба пытается использовать неявные аннотации

Вы должны попробовать перейти на:

.factory('mouseCapture', ['$rootScope', function ($rootScope) {...}]);

синтаксис, всякий раз в строгом режиме.

Ответ 3

Просто добавьте 'ngInject' в первую строку вашего конструктора.

Ответ 4

добавление ngInject было ответом, который работал для меня. На самом деле я использую машинопись с angularjs и добавляю/@ngInject/прямо перед тем, как конструктор сделал свое дело.