Как создать настраиваемые модули в AngularJS

Я занимаюсь AngularJS, и я создал небольшую коллекцию директив и сервисов, которые я хотел бы упаковать в один JS файл, чтобы я мог их использовать в любом месте.

У меня есть некоторые настройки для веб-сайта, которые мой модуль будет нужен для вызовов API и тому подобное. Мне просто интересно, что сделать Angular способ создания настраиваемых модулей. Очевидно, я не хочу изменять свой многоразовый JS файл для каждого веб-сайта, так как этот вид побеждает цель его использования. Увидев, что значения будут оставаться неизменными для каждого веб-сайта, кажется, что это ужасно много хлопот, чтобы передать их в качестве аргумента для каждого вызова функции, и я предпочел бы как можно больше держаться подальше от глобальных переменных.

Я искал множество вопросов для ответов, которые я искал, и ближайший шаблон, который я нашел до сих пор, заключается в том, чтобы мой модуль многократного использования зависел от не включенного модуля, называемого "настройки" или что-то еще, а затем определял, что модуль в файле JS-страницы, позволяя повторному модулю извлекать из него значения. Вот пример, чтобы показать, что я имею в виду.

Это кажется мне обратным. Это похоже на наличие значений вытягивания функции из глобальных значений вместо передачи значений в качестве аргументов.

Действительно ли это лучший способ сделать это, или есть альтернатива?

ОТВЕТЫ

Ответ 1

Похоже, вы ищете поставщик.

Вы должны использовать рецепт поставщика только тогда, когда вы хотите открыть API для всей конфигурации приложения, которая должна быть выполнена до запуска приложения. Обычно это интересно только для многоразовых сервисов, поведение которых может немного варьироваться между приложениями.

Вот очень простой пример поставщика:

myMod.provider('greeting', function() {
  var text = 'Hello, ';

  this.setText = function(value) {
    text = value;
  };

  this.$get = function() {
    return function(name) {
      alert(text + name);
    };
  };
});

Это создает новую службу, как и вы, с myMod.service или myMod.factory, но предоставляет дополнительный API, доступный во время настройки, а именно метод setText. Вы можете получить доступ к поставщику в блоках config:

myMod.config(function(greetingProvider) {
  greetingProvider.setText("Howdy there, ");
});

Теперь, когда мы вводим службу greeting, Angular вызовет метод провайдера $get (вводя любые сервисы, которые он запрашивает по своим параметрам), и дает вам все, что он возвращает; в этом случае $get возвращает функцию, которая при вызове с именем будет предупреждать имя с тем, что мы установили с помощью setText:

myMod.run(function(greeting) {
  greeting('Ford Prefect');
});

// Alerts: "Howdy there, Ford Prefect"

Именно так работают другие поставщики, такие как $httpProvider и $routeProvider.

Для получения дополнительной информации о поставщиках и инъекции зависимостей в общем случае ознакомьтесь с этим SO-вопросом об инъекции зависимостей.