angular.js $ resource作为具有动态根目录的“服务”

Question

我有一个基于Angular的JS库，我想提供给我的客户。它通过以下方式定义了许多服务：

angular.module('Services', [
    'ngResource'
]).factory('UserService', function($resource) {
    return function(whatsonUserId) {
        return $resource('/rest/user/:action');
    }
}. factory ...

要使用我的图书馆，我的客户只需执行以下操作：

app.controller('Ctrl', function(UserService) {
    ...
    UserService().doSomething()
}

当我的客户使用此库时，他们会在自己的HTML中使用该库，而这些HTML显然是从其自己的URL加载的，从而使根URL对于MY服务不正确。因此，很显然，纠正此问题的方法是向$ resource提供一个绝对URL：

        return $resource('www.my.server.url/rest/user/:action');

但是我只有一个'my.server.url'-我有几个。我有一个临时环境，我有一个开发环境，还有我的生产环境-有些是针对每个客户的。

我的问题是：有没有办法我可以拥有一个通用的“服务”，并让我的图书馆用户为“服务”指定“服务器根目录”？

Answer 1

这是提供程序api的好用例。您可以使用定义api module.provider。为您的服务器配置定义一个提供程序，例如

module.provider('serverConfig',function() {
    var serverUrl='val';     //default url
    this.setServerUrl=function(url) {
       serverUrl=url;
    };
    this.$get=[function(){
       return {url:serverUrl};
    }];
})

定义了这样的配置服务后，请在您自己的每个服务中使用它，例如

factory('UserService', function($resource,serverConfig) {
    return function(whatsonUserId) {
        return $resource(serverConfig.url+'/rest/user/:action');
    }

提供者需要在配置阶段进行配置

myApp.config(["serverConfigProvider", function(serverConfigProvider) {
  serverConfigProvider.setServerUrl('serverUrlstring');
}]);