我应该如何在AngularJS中配置模块

How should I make configurable modules in AngularJS

本文关键字：配置 模块 AngularJS 我应该      更新时间：2023-09-26

我一直在摆弄AngularJS，我已经建立了一个指令和服务的小集合，我想把它们打包到一个单独的JS文件中，这样我就可以在任何地方使用它们了。

我有一些网站特定的设置，我的模块将需要API调用和那种东西。我只是想知道Angular制作可配置模块的方式是什么。显然，我不想为每个网站修改我的可重用JS文件，因为那样会违背拥有它的目的。由于每个网站的值都保持不变，因此将它们作为每个函数调用的参数传递给它们似乎是非常麻烦的，我宁愿尽可能地远离全局变量。

我已经为我寻求的答案搜索了很多问题，到目前为止，我发现最接近的模式是让我的可重用模块依赖于一个不包含的模块，称为"设置"或其他东西，然后在页面的JS文件中定义该模块，允许可重用模块从中提取值。这里有一个例子来说明我的意思。

这对我来说似乎是倒退的。这有点像让一个函数从全局值中提取值，而不是将值作为参数传递。

这真的是最好的方法吗，还是有其他选择?

听起来你在寻找供应商。

只有当你想要为应用程序范围内的配置公开API时，你才应该使用Provider配方，而这些配置必须在应用程序启动之前进行。这通常只对行为可能需要在应用程序之间略有不同的可重用服务感兴趣。

下面是一个非常基本的提供者示例: 
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问题。

相关文章：