Angular.js提供者：返回之前解析$ http请求

Question

I have a provider that looks something like the following:

angular.module('myProvider', function(){
  var appUrl = ''
  this.setAppUrl = function(url){
    appUrl = url;
  }
  this.$get = ['$http', function($http){
    return {
      appAction: function(){
        $http.get(appUrl).then(function(response){
          //do stuff
        });
      }
    }
  }]
});

Currently the app sets the appUrl in a .config block based on constants generated as part of the build process using grunt ngconstant.

I'm trying to change the app over to loading the config file from a json file via $http. The provider now looks something like this:

angular.module('myProvider', function(){
  this.$get = ['$http', function($http){
    return $http.get('path/to/config.json').then(function(response){
      appUrl = response.appUrl;
      return {
        appAction: function(){
          $http.get(appUrl).then(function(response){
            //do stuff
          });
        }
      }
    });
  }]
});

This loads the config from the remote source, but has the unwanted side effect of returning a promise instead of an actual function. I've tried (unsuccessfully) to resolve the promise before returning the value from the provider. I don't want to change the rest of my application to expect a promise instead of a function to be returned. What's the best way to make sure that this method returns a function?

Answer 1

The appAction method of the service returns a promise anyway; so we keep the value of appUrl : if it is non-null, we use it to retrieve our data. Otherwise we chain promises: first retrieve the configuration, then retrieve the real data. Something like the following:

angular.module('myProvider', function(){
  this.$get = ['$http', function($http){
    var appUrl;

    function retrieveTheRealData() {
      return $http.get(appUrl).then(function(response){
        //do stuff
      });
    }

    return {
      appAction: function() {
        if( appUrl ) {
          return retrieveTheRealData();
        }
        else {
          return $http.get('path/to/config.json').then(function(response){
            appUrl = response.appUrl;
            return retrieveTheRealData();
          });
        }
      }
    };
  }]
});