How to inherit from base provider (not the provider factory)?

201 views Asked by At

Say I have this base provider:

angular.module('app').provider('BaseClient', function () {
    this.setSomething = function (something) {
        // Store `something` somewhere
        return this;
    };
});

And now these 2 other sub-providers:

angular.module('app').provider('ClientA', function () {
    this.$get = function () {
        return {
            foo: function () {
                console.log('FOO', /* Read `something`, needs to output 'aaa' */);
            }
        }
    };
});

angular.module('app').provider('ClientB', function () {
    this.$get = function () {
        return {
            bar: function () {
                console.log('BAR', /* Read `something`, needs to output 'bbb' */);
            }
        }
    };
});

angular.module('app').config(function (clientAProvider, clientBProvider) {
    clientAProvider.setSomething('aaa');
    clientBProvider.setSomething('bbb');
});

How do I make ClientA and ClientB inherit the provider section of BaseClient in such a way that I can call clientAProvider.setSomething('aaa') and clientBProvider.setSomething('bbb') and store that value per provider, while using the same setSomething implementation?

I have a bunch of these providers (more than these 2) where the provider section is always the same, the configuration implementation is always the same but the factory section of those providers are different.

Thoughts?

1

There are 1 answers

13
Steven Weng On BEST ANSWER

You could inject BaseClientProvider into your ClientA provider.

Full code is here plnkr


app.provider('BaseClient', function() {
  this.config = {
    something: null
  };

  this.setSomething = function(something) {
    this.config.something = something;
    return this;
  };

  this.$get = function() {};
});

app.provider('ClientA', ['BaseClientProvider', function(BaseClientProvider) {
  var self = this;
  angular.extend(self, BaseClientProvider);
  self.$get = function() {
    return {
      foo: function() {
        console.log('FOO', self.config.something);
      }
    }
  };
}]);