【问题标题】:How do you make a service configurable in angularjs?如何在 angularjs 中配置服务?
【发布时间】:2013-07-15 13:41:08
【问题描述】:

我获得了需要配置的 Angular 服务,这样我可以从我的应用程序中移除耦合并共享我的一些代码。

我的问题是你如何做到这一点?

使用 module.value() 和依赖注入?那么如何获得默认值呢?你如何在初始化时计算出一个值而不是硬编码?

使用其他服务?你怎么把它变成通用的?

你有代码示例吗,因为我对此有点迷茫。

【问题讨论】:

  • 在初始化时计算而不是硬编码是什么意思?您可以更新使用 module.value 创建的值,而不是 module.constant,您也可以使用 ng-init,您可能会异步获取一些数据,然后设置注入的 module.value()
  • 假设我想获取配置值,用它进行异步调用,取回一个值,然后将其注入我的服务中。
  • 是的,所以如果我理解正确,您读取了一些先前使用 module.value(key,value) 调用设置的配置值,通过调用 $injector.get(key) 来获取值,如果你不确定注入器是否已经配置了那个键,你可以用 try catch 块包围,并且可以在任何一种情况下给它一些默认值,你可以再次使用 module.value() 我相信添加或更改任何值注入。也许您担心在更新服务之前已经为服务等注入了值,我相信 $injector.get() 会为您检索最新的值。
  • 啊,好吧,我在这里再读了几次您的问题,所以您正在寻找更像是在 Java 中获得的属性文件,您可以在其中配置服务之外的事物列表但是是用来配置的吗?如果是这样,您可以只使用一个单独的 JS 文件来设置所有 module.value 调用,并且您可以使用 GruntJS 之类的东西来设置一个构建配置,该配置根据您的构建目标加载适当的 JS 文件(或者甚至可以重新写一些文件,虽然我不确定有哪些 grunt 任务可用)
  • 我投票结束我自己的问题,因为我在这里找到了答案:stackoverflow.com/questions/23600051/…

标签: angularjs angularjs-service


【解决方案1】:

如果您要使用 .value() 声明一些要注入的对象,我相信这样的事情应该可以在您的服务中使用

var myLocalValue = myInjectedValue || "Some default value";

我不是超级精通 javascript,但这个关于 SO 的答案似乎逃避了这样一个事实: JavaScript OR (||) variable assignment explanation

我在这里做了一个小提琴来测试它似乎可以按我的预期工作:

http://jsfiddle.net/u3MY8/1/

JavaScript

var app = angular.module("myapp",[]);
// define a value
app.value('myThing', 'weee');

// use it in a service
app.factory('myService', ['myThing', function(myThing, myOtherThing){
    var myLocalOtherThing = myOtherThing || "some default";
   return {
       whatsMyThing: function() { 
          return myThing; //weee
       },
       whatsMyOtherThing: function() {
           return myOtherThing;
       },
       whatsMyOtherThingWithDefault: function() {
           return myLocalOtherThing;
       }
    }
}]);

// use it in a controller
app.controller('someController', function($scope, myService) {
    $scope.foo = myService.whatsMyThing(); //weee
    $scope.bar = myService.whatsMyOtherThing(); //""
    $scope.baz = myService.whatsMyOtherThingWithDefault(); //some default
});

HTML

<div ng-app="myapp" ng-controller="someController">
    <ol>
        <li>{{foo}}</li>
        <li>{{bar}}</li>
        <li>{{baz}}</li>
    </ol>
</div>

请注意,这仅在 myOtherThing 未注入时才有效,如果您列出要注入但尚未定义它,您会遇到错误,但我不确定用例到底是什么。

【讨论】:

  • 如何在不注入的情况下传递 myOtherThing ?您手动设置服务?在我看来,它违背了使用 angularjs 的目的?
  • 好吧,所以我更新了小提琴几次,因为我明白你在说什么,如果你不能在不知道它被声明的情况下注入它而没有错误,那么你就不能默认。 .. 相反,我使用 $injector 服务来 .get() 服务,并用 try catch 块包围它,以防它未声明。 jsfiddle.net/u3MY8/3
  • 好的,我会 +1,因为这会起作用(至少是同步的),但我无法想象这会是正确的方法。一定有别的办法……
  • @e-satis 很可能我还在 Angular 中学到了很多东西,所以根据我目前所知道的情况,我可能有更好的方法。
【解决方案2】:

为了创建可配置服务,您需要使用provider,请参阅:http://docs.angularjs.org/guide/providers。提供程序允许您在模块实例化之前在模块的配置块中配置工厂或服务。简单示例见http://plnkr.co/edit/QMLBBQ3obE90FtCA2eBu

有关如何使用可配置服务的更完整/复杂的示例,我建议查看the Restangular project,它还演示了一种提供可由应用程序开发人员覆盖的默认值的方法。

【讨论】:

    猜你喜欢
    • 2019-05-08
    • 1970-01-01
    • 1970-01-01
    • 2013-03-25
    • 2014-03-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-03-20
    相关资源
    最近更新 更多