javascript - angular.js $resource 作为 'service' 与动态根

Question

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

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 中使用它，这显然是从他们自己的 URL 加载的，这使得我的服务的根 URL 不正确。很明显，纠正这个问题的方法是为 $resource 提供一个绝对 URL:

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

但我不只有一个“my.server.url”——我有几个。我有暂存环境、开发环境和生产环境 - 有些是针对每个客户的。

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

Answer 1

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

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');
    }

provider需要在config阶段配置

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