1. Инъекция зависимости
Инъекция зависимости (DI) - это шаблон проектирования программного обеспечения, который касается того, как код получает ресурсы, от которых он зависит.
Для более глубокой дискуссии о DI вы можете посетить инъекцию зависимости (http://en.wikipedia.org/wiki/dependency_incection), инверсию контроля (http://martinfowler.com/articles/incection.html), или вы можете посетить книгу по схемам проектирования программного обеспечения.
1. Di в двух словах (просто говоря DI)
объект или функция могут получить ресурсы, от которых они зависят только в следующих трех способах:
1) Вы можете создавать зависимые ресурсы через нового оператора.
2) Вы можете найти зависимые ресурсы через глобальные переменные.
3) Зависимые ресурсы могут быть переданы через параметры.
Два метода 1 и 2 не самые лучшие, потому что они жестко кодируют зависимости, что делает невозможным изменение зависимостей, но это станет более сложным. Это особенно проблема для тестирования, и обычно при самостоятельном тестировании желательно, чтобы обеспечить фиктивные зависимости.
Третий метод является относительно наиболее возможным, потому что он устраняет ответственность за поиск зависимостей от компонентов. Reliance только что передается компонентам.
Функция someclass (rewer) {this.greeter = greeter} someclass.prototype.dosomething = function (name) {this.greeter.greet (name);}В приведенном выше примере что -то не нужно заботиться о том, чтобы найти зависимость от приветствия, оно проходит только приветствие во время выполнения.
Это более уместно, но оставляет ответственность за получение ресурсов зависимости в коде, ответственного за создание чего -то.
Чтобы управлять ответственностью за создание зависимостей, каждое угловое приложение имеет инжектор (http://code.angularjs.org/1.0.2/docs/api/angular.injector). Инжектор - это локатор услуг, который отвечает за поиск и создание зависимых ресурсов.
Запросить зависимости, решает проблему жесткого кода, но это означает, что инжектор должен работать через все приложение. Прохождение инжектора уничтожит закон Деметры (http://baike.baidu.com/view/823220.htm). Чтобы исправить эту проблему, мы передаем ответственность за поиск зависимостей в инжектор.
Я так много сказал выше. Посмотрите на примеры, которые я изменил ниже. Я объединил два примера исходного текста, используя инъекцию внутри и снаружи углового:
<!DOCTYPE HTML><html lang="zh-cn" ng-app="MainApp"><head> <meta charset="UTF-8"> <title>injector</title></head><body><div ng-controller="MyController"> <button ng-click="sayHello()">Say Hello</button></div><script src = "../ angular -1.0.1.js" type = "text/javascript"> </script> <script type = "text/javascript"> // Создание модуля другого модуля, который эквивалентен внешнему модулю var orthymodule = angular.module ("другой модуль", []); // Учить инъектор, как создать «приветствие» // Обратите внимание, что сам greter должен полагаться на $ window othermodule.factory ("Greeter", function ($ window) {// Это фабричный метод, ответственный за создание сервиса приветствия {greet: function (text) {$ window.alert (text);};};}); // Следующее показывает, что в модуле без тока вызовите метод приветствия через инжектор: // Создать новый инжектор из модуля // Этот шаг обычно выполняется автоматически при запуске угловых. // «Нг», необходимо ввести угловые вещи // Порядок преднамеренно обращен, и временно подтверждается, что порядок этой вещи не имеет значения. Полем var injector = angular.injector (['orethermodule', 'ng']); // Запрос Зависимость приветствия. var g = Injector.get ("Greeter"); // назовите это напрямую ~ g.greet ("Привет ~ моя маленькая дада ~"); // Это текущее основное приложение, и вам нужно полагаться на другие модуля var mainApp = angular.module («mainApp», ["othermodule"]); // Обратите внимание на параметры функции определения контроллера и непосредственно введите применение и приветствие здесь. // Служба Greeter IS mainApp.controller ("myController", function myController ($ scope, greeter) {$ scope.sayhello = function () {greeter.greet ("hello kitty ~~");};}); // ng-controller сделал это молча за кулисами //injector.instantiate(mycontroller); </script> </body> </html>Обратите внимание, что, поскольку есть NG-контроллер, MyController инициализируется, он может соответствовать всем зависимостям MyController, так что MyController не нужно знать существование инжектора. Это лучший результат. Код приложения просто запрашивает необходимые ему зависимости без обработки инжектора. Эта обстановка не нарушит закон Деметры.
2. Аннотация зависимости (комментарии зависимости, объясняя способ зависимостей)
Как инжектор узнает, какой сервис должен быть введен?
Разработчики приложений должны предоставить информацию аннотации, используемую инжектором в качестве решения для зависимостей. Все существующие функции API в угловом виде относятся к инжектору, и это относится к API, упомянутому в каждом документе. Вот три эквивалентных способа аннотирования нашего кода информацией по имени службы.
1. Вывод зависимости
Это самый простой способ получить зависимый ресурс, но необходимо предположить, что имя параметра функции согласуется с именем зависимого ресурса.
Функция myController ($ accope, greeter) {...}Инжектор функции может угадать имя сервиса, которую необходимо ввести (functionName.toString (), regexp), проверив определение функции и извлекая имя функции. В приведенном выше примере $ scope и greeter являются двумя службами, которые необходимо вводить в функцию (имена также одинаковы).
Хотя это просто, этот метод не будет работать после сжатия запугивания JavaScript, поскольку имя параметра будет изменено. Это делает этот метод полезным только для преподобного (метод моделирования прототипа продукции, метод моделирования прототипа продукта, http://www.pretotyping.org/, http://tech.qq.com/a/20120217/000320.htm) и демонстрационные приложения.
2. $ Annotation ($ Inject Comment)
Чтобы позволить компрессору скрипта переименовать метод функции и все еще иметь возможность вводить правильную службу, функция должна комментировать зависимость через свойство $ inject. Собственность $ inject - это множество имен услуг, которые необходимо вводить.
var myController = function (переименованная в $ racpope, renamedgreeter) {...} // Если вещь, которая здесь зависит, не в текущем модуле, он все еще не распознает его. // Вам нужно сначала полагаться на соответствующий модуль в текущем модуле. Это похоже на предыдущий пример. Но я не знаю, правильный ли это.
MyController. $ Inject = ['$ scope', 'regreter'];
Должно быть осторожно, чтобы порядок $ inject должен соответствовать порядку аргументов, объявленного функцией.
Этот метод аннотации полезен для объявлений контроллера, поскольку он указывает информацию о аннотации с функцией.
3. Встроенная аннотация (встроенные комментарии)
Иногда не удобно использовать метод аннотации $ Inject, например, при непосредственном комментировании.
Например:
somemodule.factory ('Greeter', function ($ window) {...;});Поскольку необходимы временные переменные (не позволяйте его не использовать после сжатия), код будет размыться как:
var greeterFactory = function (переименованное $ window) {...;}; greeterFactory. $ inject = ['$ window']; somemodule.factory ('regreter', rewerfactory);Из -за этого (вздутие кода), Angular также предоставляет стиль третьего комментария:
somemodule.factory ('Greeter', ['$ window', function (переименованное $ window) {...;}]);Помните, что все стили комментариев эквивалентны и могут использоваться в любом месте в угловой, которая поддерживает инъекцию.
3. Где я могу пользователь DI?
DI повсюду. Обычно используется в методах контроллера и заводов.
1. DI в контроллерах
Контроллер является классом, ответственным за (описание) поведения приложения. Рекомендуемый метод объявления контроллера:
var mycontroller = function (dep1, dep2) {...} myController. $ inject = ['dep1', 'dep2']; myController.prototype.amethod = function () {...}2. Заводские методы
Метод завода отвечает за создание большинства угловых объектов. Например, директива, служба, фильтр. Метод завода зарегистрирован в модуле. Рекомендуемый метод декларации фабрики:
angualar.module ('mymodule', []). config (['depprovider', function (depprovider) {...}]). Factory ('serviceId', ['depService', function (depService) {...}]). Directive ('DiMiMeviename', ['DepService', function (depService) {...}]). Filter ('file Entername', ['depService', function (depService) {...}]);Выше приведено краткое изложение информации об инъекции зависимости AngularJS. Спасибо за поддержку этого сайта!