Причина использования обозначения массива при определении контроллера AngularJS

Извиняется, если этот вопрос звучит слишком очевидно.

Недавно я начал изучать и изучать AngularJS. Я прошел несколько хороших уроков -

.. и есть несколько других, которые я видел.

Я не говорю, что прочитал/изучил все документы.

Вопрос начинается здесь -

Теперь, придя к вопросу, я вижу, что определение контроллера различно в одном месте и отличается от другого -

В одном определении используется тип записи массива (не обязательно официальный термин) для инъекций:

app.controller("MyCtrl", ['$scope', function($scope){
    $scope.someData = "Array notation";
}]);

И вот это, без массива:

app.controller("MyCtrl", function($scope){
    $scope.someData = "non-array notation";
});

Не сказать, что это единственное, что я пытаюсь понять, но да, я определенно хотел бы понять разницу.

Есть ли разница между двумя?

Большое спасибо.

Примечание. Я искал похожие вопросы в SO, но не смог найти то, что искал. К сожалению.

Ответ 1

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

Существует библиотека под названием ng-annotate, которая заменит второй пример на первый пример, чтобы код снова стал безопасным.

Ответ 2

Между двумя подходами нет большой разницы. Оба кода работают одинаково. Но если вы используете второй код, это смущает вас после того, как вы уменьшите свой код.

Посмотрите пример: -

  app.controller("MyCtrl", function(a){ ... });//$scope is changed to a

И ваш код не будет работать, поскольку код AngularJs использует переменную $scope, поскольку он не принимает параметры первого, второго, третьего и т.д.

Итак, первый код более безопасен, чем второй, как если бы вы минимизировали код, он все равно будет принимать одну и ту же переменную i.e. $scope.

Посмотрите пример:

app.controller("MyCtrl", ['$scope', function(a){...}]);//a refers to $scope

Таким образом, приведенный выше код работает отлично, когда вы уменьшаете код, поскольку $scope вводится вместо a.So, если вы передаете несколько параметров, а затем упорядочиваете вопросы в этом примере.

Посмотрите на следующее:

 app.controller("MyCtrl", ['$scope','$timeout' ,function(a,t){...}]);

где a вводится как $scope и t вводится как $timeout.

Итак, если вы измените порядок параметров, переданных как

app.controller( "MyCtrl", ['$ timeout', '$ scope', function (a, t) {...}]); где a $timeout и t $scope.

Итак, упорядочение вопросов в этом примере, но в вашем втором примере упорядочение кода не имеет значения, поскольку имя имеет значение, как $scope, $timeout.

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

 MyCtrl.$inject = ['$scope'];

Для нескольких параметров

 MyCtrl.$inject = ['$scope','$timeout'];

Итак, в основном есть три вида аннотаций:

Неявная аннотация - ваш первый пример кода
$inject Объявление свойства - метод $inject
Inline Array Annotation - ваш второй пример кода

Вы можете узнать больше об этом здесь

Ответ 3

Есть разница, когда дело доходит до минимизации. Если вы хотите минимизировать свой файл, как это может быть сделано для повышения производительности, это может привести к возникновению проблем, если вы использовали вариант два.

Так как Angular определяет зависимости контроллера от имен аргументов функции конструктора контроллера, если вы хотите минимизировать код JavaScript для контроллера, все его аргументы функции также будут уменьшены, а инжектор зависимостей будет не сможет правильно идентифицировать службы.

Итак, по существу вам лучше использовать первый вариант, задействован небольшой бит, но он безопаснее и не сломается, если вы уменьшите свой код:-)

Это довольно короткое учебное пособие, но оно прекрасно объясняет.